css清除浮动的四种方法

额外标签法

w3c推荐用法

<div class="tablist" >
    <div style="float:left">标签1</div>
    <div style="float:left">标签2</div>
    <div style="float:left">标签3</div>
    <div style="item">标签4</div>
    <div style="clear:both"></div>
</div>

overflow

最简单

给父元素添加 ：

overflow：hidden/auto/scroll

：after伪元素法

百度、淘宝、网易用的方法

给父元素添加：

.clearfix:after{
    content:"";
    display:block;
    height:0;
    clear:both;
    visibility:hidden
}
.clearfix { /* IE6、7专有 */
    *zoom :1
}

双伪元素法

小米、腾讯用的方法

.clearfix:before,
.clearfix:after{
    content:"";
    display:table;
}
.clearfix:after{
    clear:both;
}
.clearfix { /* IE6、7专有 */
    *zoom :1
}