清除浮动的几种方式

• 额外标签法，在最后一个浮动标签后，新加一个标签，为其设置clear：both

优点：通俗易懂，方便

缺点：添加无意义标签，语义化差

• 父级添加overflow：hidden

优点：代码简洁

缺点：内容增多时容易造成不会自动换行，导致内容被隐藏掉，无法显示出要溢出的元素

• 伪元素清除浮动法

.clear:after{
content:””;
display:block;
clear:both;
height:0;
overflow:hidden;/visibility:hidden;
}

优点：符合闭合浮动思想，结构语义化正确

缺点：ie6-7不支持伪元素:after，使用zoom:1触发hasLayout

• 父级div定义overflow:auto（必须定义width或zoom:1，同时不能定义height，使用overflow:auto时，浏览器会自动检查浮动区域的高度）

优点：简答、代码少、浏览器支持好

缺点：内部宽高超出父级div时，会出现滚动条