如果有乙個div作為外部容器，內部的div如果設定了float樣式，則外部的容器div因為內部沒有 c導致不能被撐開。看下面的例子：
div布局如下：
css**如下：
css code複製內容到剪貼簿
ie和ff顯示如下圖：
傳統的人解決方法：
但是，這麼多加乙個div有點不妥。一是多了乙個沒有意義的div，二是在用dojo做drag & drop的時候，由於這個div是容器div的乙個字節點，如果這個節點被移動，則會造成排版上的bug：如果要顯示的藍框的div被移到這個div之後，則因為clear:both，它會被強制換一行顯示。所以，最好使用下面clearfix方法。外層div加上clearfix樣式。
clearfix定義如下：
css code複製內容到剪貼簿
這樣修改以後顯示正常。
那段**是用來清除浮動的。
以下**可以這麼解釋：
css code複製內容到剪貼簿
整段**就相當於在浮動元素後面跟了個寬高為0的空div，然後設定它clear:both來達到清除浮動的效果。（這個css的原理是經過使用 after偽物件,它將在應用clearfix的元素結尾新增content中的內容,也就是乙個".",並且把他設定為塊級元素 (display="blounlheztck");高度設定為0,clear="both",然後將其內容隱藏掉(visibility="hidden").這樣就會撐開此塊級元素.）
之所以用它，是因為，你不必在html檔案中寫入大量無意義的空標籤，又能清除浮動。
.clearfix
本文標題: css之clearfix的用法深入理解(必看篇)
本文位址:
CSS之關於clearfix 清除浮動
一，什麼是.clearfix 你只要到google或者baidu隨便一搜 css清除浮動 就會發現很多 都講到 盒子清除內部浮動時可以用到.clearfix clearfix after clearfix div class clearfix div class floated div div 上面...
CSS之使用clearfix清除浮動
block一般乙個塊佔一行，除非float inline是自動排為一行，就象段內的文字一樣，可成為多行。clear both 語法 clear none left right both none 允許兩邊都可以有浮動物件 both 不允許有浮動物件 left 不允許左邊有浮動物件 right 不允許...
閒聊CSS之關於clearfix 清除浮動
一，什麼是.clearfix 你只要到google或者baidu隨便一搜 css清除浮動 就會發現很多 都講到 盒子清除內部浮動時可以用到.clearfix clearfix after clearfix div class clearfix div class floated div div 上面...