.clearfix的原理

.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的块级元素，从而达到清除浮动的作用。