偽元素清除浮動及原理

.clearfix:after {content:"."; display:block; height:0; visibility:hidden; clear:both; }

.clearfix { *zoom:1; }

1) display:block 使生成的元素以塊級元素顯示,占滿剩余空間;

2) height:0 避免生成內容破壞原有布局的高度。

3) visibility:hidden 使生成的內容不可見，並允許可能被生成內容蓋住的內容可以進行點擊和交互;

4）通過 content:"."生成內容作為最后一個元素，至於content里面是點還是其他都是可以的，例如oocss里面就有經典的 content:"XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",有些版本可能content 里面內容為空,一絲冰涼是不推薦這樣做的,firefox直到7.0 content:”" 仍然會產生額外的空隙；

5）zoom：1 觸發IE hasLayout。