Boostrap清除浮動的css如下：
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
/**
* For IE 6/7 only
*/
.clearfix {
*zoom: 1;
}
- :after偽類在元素末尾插入了一個包含空格的字符，并設置display為table
- display:table會創建一個匿名的table-cell，從而觸發塊級上下文（BFC），因為容器內float的元素也是BFC，由于BFC有不能互相重疊的特性，并且設置了clear: both，:after插入的元素會被擠到容器底部，從而將容器撐高。并且設置display:table后，content中的空格字符會被渲染為0*0的空白元素，不會占用頁面空間。
- content包含一個空格，是為了解決Opera瀏覽器的BUG。當HTML中包含contenteditable屬性時，如果content沒有包含空格，會造成清除浮動元素的頂部、底部有一個空白（設置font-size：0也可以解決這個問題）。
- :after偽類的設置已經達到了清除浮動的目的，但還要設置:before偽類，原因如下
- :before的設置也觸發了一個BFC，由于BFC有內部布局不收外部影響的特性，因此:before的設置可以阻止margin-top的合并。
- 這樣做，其一是為了和其他清除浮動的方式的效果保持一致；其二，是為了與ie6/7下設置zoom：1后的效果一致（即阻止margin-top合并的效果）。
- zoom: 1用于在ie6/7下觸發haslayout和contain floats
