.clearfix的应用:
.clearfix:after {content: " ";display: block;clear: both;height: 0;}
.clearfix {zoom: 1;}
.clearfix的原理：
1、在IE6, 7下zoom: 1会触发hasLayout，从而使元素闭合内部的浮动。
2、在标准浏览器下，.clearfix:after这个伪类会在应用到.clearfix的元素后面插入一个clear: both的块级元素，从而达到清除浮动的作用。
<div>
<div class="floated"></div>
<div style="clear:both"></div>
