《精彩绝伦的CSS》——布局（四）清除浮动

四、清除浮动

1、清除浮动最最简单的方式就是在文档中插入一个元素，并设置它的clear属性。

<div class="colum one">...</div><div class="colum two">...</div><div class="colum three">...</div><br class="clearfix">

这里的br元素是关键，它会把自身以及后面跟随的任何元素都放置在之前出现的浮动栏的下方。为此，需一下内容：

.clearfix{display:block; clear: both;}

使用这种方式有可能会插入空白行，因此可以这样设置：.clearfix{display:block; clear:both; font-size:0; height:0;}

    2、相邻删除

这还是一个可以删除紧跟在其他元素之后的元素的方法，只要被清除的元素与浮动元素拥有相同的父元素即可。

<div class="colum one">...</div><div class="colum two">...</div><div class="colum three">...</div>
<p>...</p>

清除<p>元素浮动：div.three + p{clear:both;}

或者一个更通用的方法：div.three + *{clear:both;}