标签：
因为将子元素都设置为浮动后，父元素内部就好像没有东西了，被掏空了，无法被子元素撑起来。所以就会出现塌陷的情况。
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .first, .second { float:left; background:red; width:100px; height:50px; margin:10px; } #wrap { border:10px solid black; width: 300px; } </style> </head> <body> <div id="wrap"> <div class="first"></div> <div class="second"></div> </div> </body> </html>
所以就需要清理浮动。
.clearfix:after {content:"."; display:block; height:0; visibility:hidden; clear:both; }
.clearfix { *zoom:1; }由于IE6-7不支持:after，使用 zoom:1触发 hasLayout。
<div id="wrap" class="clearfix"> //这里在父元素写了一个class：clearfix。然后就解决问题了。 <div class="first"></div> <div class="second"></div> </div> .clearfix:after{ content:"."; display:block; height:0; visibility:hidden; clear:left; } #wrap { border:10px solid black; width:320px; }
这个好像是比较好的一种方法了。
这是昨天看的关于闭合浮动的文章。那些年我们一起清除过的浮动。
标签：
原文地址：http://www.cnblogs.com/liurenxingyu/p/4850741.html
