添加评论
分享
默认排序按时间排序
3 个回答
代码是不是这样的啊?
<ul>
<li style="float:left">test float</li>
</ul>
<div>after div</div>
如果是的话, 出来的效果是li跟div在一排了
因为没有clear, 这样就会好:
<ul>
<li style="float:left">test float</li>
</ul>
<div style="clear:both"></div>
<div>after div</div>
建议的做法是这样, 代码会好看一些, 而且兼容各种浏览器哦
<style>
.clearfix:before, .clearfix:after { content:""; display:table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
</style>
<ul class="clearfix">
<li style="float:left">test float</li>
</ul>
<div>after div</div>
如果你问的为什么要clear的话, 请看这里: http://w3school.com.cn/css/css_positioning_floating.asp
<ul>
<li style="float:left">test float</li>
</ul>
<div>after div</div>
如果是的话, 出来的效果是li跟div在一排了
因为没有clear, 这样就会好:
<ul>
<li style="float:left">test float</li>
</ul>
<div style="clear:both"></div>
<div>after div</div>
建议的做法是这样, 代码会好看一些, 而且兼容各种浏览器哦
<style>
.clearfix:before, .clearfix:after { content:""; display:table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
</style>
<ul class="clearfix">
<li style="float:left">test float</li>
</ul>
<div>after div</div>
如果你问的为什么要clear的话, 请看这里: http://w3school.com.cn/css/css_positioning_floating.asp
苏亮 鸡蛋糕跟你嘴角果酱我都想要尝是因为你的li浮动了，不占整个文档的位置，包裹li的ul就默认里面是不占位的。所以在整个文档流里面就没有ul了，这样的话，后来的div就会造成一种浮动的假象，因为他以为前面没有东西了，实际上是ul不占位了。解决的方法就是清除掉li的浮动，方法就是楼上的楼上给的，而且第二种是最好用的，没有什么废标签。
我来回答这个问题