在網(wǎng)頁(yè)設(shè)計(jì)中，清理浮動(dòng)是一項(xiàng)重要的任務(wù)，它可以確保頁(yè)面布局的穩(wěn)定性和一致性。鏟除起浮一個(gè)但凡做頁(yè)面的人都會(huì)遇到的一個(gè)東西，可是是否我們都能夠清楚的知道，全方位的了解呢？所以一閑下來(lái)了立刻寫(xiě)了這樣的一篇文章，不能講八面玲瓏，但是基本能將我所知道的傾囊相授了。

我們大略的一起來(lái)看看鏟除起浮的辦法一共有多少個(gè)(IE里面用zoom:1就不寫(xiě)了，下一個(gè)專(zhuān)題再寫(xiě))。對(duì)應(yīng)的DEMO

選用偽類(lèi):after進(jìn)行后續(xù)空制的高度位零的偽類(lèi)層鏟除 

選用CSS overflow:auto的方式撐高 

選用CSS overflow:hidden的方式發(fā)生奇怪適應(yīng) 

選用display:table將目標(biāo)變成table形式 

選用div標(biāo)簽，以及css的clear特點(diǎn) 

選用br標(biāo)簽，以及css的clear特點(diǎn) 

選用br標(biāo)簽，以及其本身HTML的clear特點(diǎn) 

大略的看，他們都能將問(wèn)題處理；但是他們另外一方面又有著各自的利害。（一一對(duì)應(yīng)）

長(zhǎng)處結(jié)構(gòu)語(yǔ)義化徹底正確，不會(huì)發(fā)生其他的奇怪問(wèn)題。

缺陷復(fù)用方式不妥容易形成代碼量急劇增大。

主張外層輕起浮時(shí)運(yùn)用，或明晰模塊化復(fù)用方式的人運(yùn)用。 

長(zhǎng)處結(jié)構(gòu)語(yǔ)義化徹底正確，代碼量很少。

缺陷多個(gè)嵌套后，點(diǎn)擊外層的輕起浮框會(huì)遭成外層至內(nèi)層內(nèi)容全選（FF）；或者在mouseover形成寬度改動(dòng)時(shí)會(huì)呈現(xiàn)外層模塊有滾動(dòng)條（IE）。

主張內(nèi)個(gè)模塊運(yùn)用，請(qǐng)勿嵌套。 

長(zhǎng)處結(jié)構(gòu)語(yǔ)義化徹底正確，代碼量很少。

缺陷內(nèi)容增多時(shí)候極易不會(huì)自動(dòng)換行而內(nèi)容被躲藏掉。

主張寬度固守時(shí)運(yùn)用，請(qǐng)勿嵌套。 

長(zhǎng)處結(jié)構(gòu)語(yǔ)義化徹底正確，代碼量很少。

缺陷盒模型特點(diǎn)已經(jīng)改動(dòng)，可想而知奇特事件天然多得你數(shù)都數(shù)不到。

主張假如你不想改Bug改死你的話，好不要運(yùn)用；不過(guò)能夠作為alpha版本傍邊臨時(shí)性的忽悠下測(cè)試。 

長(zhǎng)處代碼量很少，復(fù)用性極高。

缺陷徹底不能完美的適應(yīng)語(yǔ)義化，不利于改版以及需求改變。

主張初學(xué)者運(yùn)用，能夠讓你快速的處理起浮問(wèn)題。 

長(zhǎng)處語(yǔ)義化程度比第5種狀況要更優(yōu)；代碼量很少，復(fù)用性極高。

缺陷語(yǔ)義化仍舊不完美，不利于改版以及需求改變。

主張初學(xué)者運(yùn)用，能夠讓你快速的處理起浮問(wèn)題。 

長(zhǎng)處語(yǔ)義化程度比第5、6種狀況要更優(yōu)；代碼量少，復(fù)用性極高。

缺陷語(yǔ)義化仍舊不完美，不利于改版以及需求改變。

主張引導(dǎo)初學(xué)者思維升級(jí)時(shí)運(yùn)用，讓其明白與其用classname來(lái)操控一種體現(xiàn)，倒不如回歸到WEB1.0的年代的網(wǎng)頁(yè)直接用html特點(diǎn)來(lái)操控體現(xiàn)，究竟后者的代碼量更少。 

后，列舉結(jié)束。綜上所述，在進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)時(shí)，可以根據(jù)實(shí)際情況選擇合適的方法來(lái)清理浮動(dòng)，以確保頁(yè)面布局的穩(wěn)定性和一致性。