可在浮動的父級加clearfix樣式。
其原理是，在「高階」瀏覽器中使用 :after 偽類在浮動塊後面加上乙個非 display:none 的不可見塊狀內容來，並給它設定 clear:
both 來清理浮動。在 ie6 和 7 中給浮動塊新增 haslayout 來讓浮動塊撐高並正常影響文件流。
這種方法也是現在最常用最有效的一種清浮動。
方法四：clearfix簡潔版
.cf:before,.cf:after
.cf:after
.cf原理還是一樣的。使用:
after偽類來提供浮動塊後的clear:both。不同的是，隱藏這個空白使用的是display:
table。而不是設定visibility:hidden;height:
0;font-size:0;這樣的hack。
值得注意的是這裡中的:before偽類。其實他是來用處理top-margin邊摺疊的，跟清理浮動沒有多大的關係。
但因為浮動會建立blockformattingcontext，這樣浮動元素上的另而一元素上如果剛好有margin-bottom而這個浮動元素剛好有margin-top的話，應該讓他們不摺疊（雖然這種情況並不常見）。
CSS浮動屬性Float詳解
什麼是浮動？浮動是 css 的定位屬性。我們可以看一下印刷設計來了解它的起源和作用。印刷布局中，文字可以按照需要圍繞 一般把這種方式稱為 文字環繞 這是乙個例子 在排版軟體裡面，存放文字的盒子可以被設定為允許 混排，或者無視它。無視 混排將會允許文字出現在 的上面，就像它甚至不會在那裡一樣。這就是 ...
CSS布局詳解浮動屬性Float
相關文章 css布局 詳解定位屬性position 什麼是浮動？浮動是 css 的定位屬性。我們可以看一下印刷設計來了解它的起源和作用。印刷布局中，文字可以按照需要圍繞 一般把這種方式稱為 文字環繞 這是乙個例子 在排版軟體裡面，存放文字的盒子可以被設定為允許 混排，或者無視它。無視 混排將會允許文...
css清除浮動的三方法
三種實用css清除浮動的方法 應用divcss網頁布局，經常性地會使用到float，很多邪門的事兒都有可能是浮動在作怪，清除浮動是必須要做的，而且隨時性地對父級元素清除浮動的做法也被認為是書寫css的良好習慣之一。下面看今天的教程，此為未清除浮動源 執行 無法檢視到父級元素淺黃色背景。left ri...