為什么我的兩個div是并排的,div不是塊級元素嗎
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>實(shí)踐題 - 選項(xiàng)卡</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實(shí)現(xiàn)選項(xiàng)卡切換
? ??
? ??
? ? </script>
?
</head>
<body>
<!-- HTML頁面布局 -->
<div>
? ? <ul>
? ? ? ? <li>房產(chǎn)</li>
? ? ? ? <li>家居</li>
? ? ? ? <li>二手貨</li>
? ? </ul>? ??
</div>
<div>
? ? 275萬購昌平鄰鐵三居 總價20萬買一居
? ? 200萬內(nèi)購五環(huán)三居 140萬安家東三環(huán)
? ? 北京首現(xiàn)零首付樓盤 53萬購東5環(huán)50平
? ? 京樓盤直降5000 中信府 公園樓王現(xiàn)房
</div>
?
</body>
</html>
2022-09-30
DIV確實(shí)是塊級元素,獨(dú)立一行顯示
F12--元素 可以看到,你的第一個DIV實(shí)際高度為0,第二個DIV才有真實(shí)高度
原因在哪里呢?將添加在li上的浮動屬性去掉就恢復(fù)正常了

造成這個現(xiàn)象的原因是元素浮動Float后會脫離標(biāo)準(zhǔn)文檔流,所以第一個DIV沒有被撐開,詳細(xì)原理看鏈接https://blog.csdn.net/Czc1357618897/article/details/122980847