css公共库——清除浮动

清除浮动是css的基础，但有时候会忘了一些最简单的东西

浮动因为在文档流之外，所以会造成父元素的坍塌。父元素之后的元素排版就会乱。

常用的方法是在浮动父元素中添加cf类，然后定义cf样式，并将其放在公共库内。

 .box.cf
     img.fl
     img.fr
 <!-- 以上是jade格式 -->

 .cf:after{
     display:table;
     content:"";
     clear:both;
 }

 .cf{*zoom:;}
 <!-- 以上为对应css -->

因为clear 属性定义了元素的哪边上不允许出现浮动元素，

这里是两边都清除了，

所以通过after插入的元素就在img（浮动）下面，不会从父元素.box的顶部开始布局，

从而也就撑起了.box。

zoom是为了满足IE6/7，不过现在应该没人用这两个浏览器了。