W3C整天研究html5，就不能抽出點(diǎn)時(shí)間來把這種煩人的小細(xì)節(jié)修正一下嗎？抱怨歸抱怨，飯還得吃，錢還得掙，清除浮動(dòng)就不能停止。

為了清除浮動(dòng)增加無語義代碼已經(jīng)是最穩(wěn)定和簡(jiǎn)單的方式，但總叫開發(fā)者心里感到不舒服，畢竟這么多年來早已習(xí)慣了結(jié)構(gòu)和樣式的分離，非要在結(jié)構(gòu)中插入這樣一行無語義代碼就會(huì)讓人覺得有種難以掌握的感受。

通過css代碼清除浮動(dòng)也不省油，光是當(dāng)前這種多個(gè)瀏覽器瓜分瀏覽器份額的狀況所帶來的各種css hack就夠讓人頭疼的了，而且這還沒說到那些個(gè)瀏覽器的不同版本之間又有多少的差別。通過css清除浮動(dòng)還是一個(gè)長(zhǎng)期的過程，因?yàn)槟氵€要期盼下一牌瀏覽器沒有針對(duì)浮動(dòng)修改對(duì)html代碼的解釋。

要說在當(dāng)前這種惡劣的狀況下，選取哪種方式去清除浮動(dòng)最為可取，這事一個(gè)人說了不算，要看大家的意見。

很多時(shí)候，開發(fā)人員在前端開發(fā)時(shí)遇到問題，就會(huì)去找那些運(yùn)用了類似技術(shù)的大型網(wǎng)站，去分析它們的解決方案，然后用到自己的網(wǎng)站上，連為什么都省得去想了。我也常常這么做。具體到清除浮動(dòng)這個(gè)問題上，我現(xiàn)在所用的無語義標(biāo)簽法就是在看到某大型網(wǎng)站用過之后，我才選用的。

不過今天重提這個(gè)問題，是因?yàn)槲矣衷谝粋€(gè)大型網(wǎng)站上看到了不同的方案。它們是這樣做的：


雖說這是來自大型網(wǎng)站，可信任度很高，可以不去思考而直接用，但學(xué)習(xí)的態(tài)度還是要有，就此分析一下其中的原理。

1）首先是利用:after偽類來兼容支持這一標(biāo)準(zhǔn)的瀏覽器們，F(xiàn)F、Chrome自然屬于強(qiáng)烈支持標(biāo)準(zhǔn)的瀏覽器行列，不過IE自從繁殖到第八代開始，也表示支持這一偽類。:after偽類用來和content屬性一起使用設(shè)置在對(duì)象后的內(nèi)容。

如果現(xiàn)在不是2012看，而是10年后，可能就不用再往下講了。但因?yàn)楝F(xiàn)在IE6和IE7還很有勢(shì)力，所以，我們還得好好照顧它們。:after偽類IE不支持，它用來和content屬性一起使用設(shè)置在對(duì)象后的內(nèi)容，例如：


這個(gè)CSS將會(huì)讓clearfix類標(biāo)簽內(nèi)的文本后邊加上英文句號(hào)。

3）"* html"這個(gè)選擇符只有IE6才能識(shí)別，因此在其中設(shè)置縮放屬性"zoom: 1;"，便可實(shí)現(xiàn)兼容IE6；"*:first-child + html"這個(gè)選擇符只有IE7才能識(shí)別，因此設(shè)置縮放屬性"zoom: 1;" 便可實(shí)現(xiàn)兼容IE7。

原理分析完畢。方法是可行的，完美解決是不可能的。所以，W3標(biāo)準(zhǔn)中的浮動(dòng)一天不變，清除浮動(dòng)就會(huì)一天不止。

最新評(píng)論