为什么我的两个div是并排的，div不是块级元素吗
慕慕4374729
2022-07-13 14:06
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>实践题 - 选项卡</title>
<style type="text/css">
/* CSS样式制作 */
ul{
list-style:none;
margin:0;
padding:0;
}
ul>li{
float:left;
width:90px;
height:42px;
border:1px solid grey;
margin:0 5px;
line-height:40px;
border-bottom:none;
text-align:center;
}
</style>
<script type="text/javascript">
// JS实现选项卡切换
</script>
</head>
<body>
<!-- HTML页面布局 -->
<div>
<ul>
<li>房产</li>
<li>家居</li>
<li>二手货</li>
</ul>
</div>
<div>
275万购昌平邻铁三居 总价20万买一居
200万内购五环三居 140万安家东三环
北京首现零首付楼盘 53万购东5环50平
京楼盘直降5000 中信府 公园楼王现房
</div>
</body>
</html>
1回答
-
- qq_爱偷猫的鱼_0
- 2022-09-30 00:35:00
DIV确实是块级元素，独立一行显示
F12--元素 可以看到，你的第一个DIV实际高度为0，第二个DIV才有真实高度
原因在哪里呢？将添加在li上的浮动属性去掉就恢复正常了
造成这个现象的原因是元素浮动Float后会脱离标准文档流，所以第一个DIV没有被撑开，详细原理看链接https://blog.csdn.net/Czc1357618897/article/details/122980847
JavaScript进阶篇
468060 学习 · 21891 问题
相似问题