使用:after 伪元素
需要注意的是 :after是伪元素（http://www.w3.org/TR/selectors/#pseudo-elements），不是伪类（某些CSS手册里面称之为“伪对象”），很多清除浮动大全之类的文章都称之为伪类，不过csser要严谨一点，这是一种态度。
由于IE6-7不支持:after，使用 zoom:1触发 hasLayout。
该方法源自于:http://www.positioniseverything.net/easyclearing.html
原文全部代码如下:
。。。。。。
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* for IE/Mac */ .clearfix {zoom: 1;/* triggers hasLayout */ display: block;/* resets display for IE/Win */} 鉴于 IE/Mac的市场占有率极低,我们直接忽略掉,最后精简的代码如下:
.clearfix:after {content:"."; display:block; height:0; visibility:hidden; clear:both; }
.clearfix { *zoom:1; }
