成人亚洲综合,日韩高清一区二区三区五区七区,三级网址日本,亚洲激情成人,av成人在线电影,亚洲免费成人在线,超清首页国产亚洲丝袜

全方位清理浮動

作者:
2010-02-28
2339
清除浮動一個凡是做頁面的人都會遇到的一個東西,但是是否大家都能夠清楚的知道,全方位的了解呢?于是一閑下來了馬上寫了這樣的一篇文章,不能講面面俱到,然而基本能將我所知道的傾囊相授了。

我們粗略的一起來看看清除浮動的辦法一共有多少個(IE里面用zoom:1就不寫了,下一個專題再寫)。對應(yīng)的DEMO

采用偽類:after進(jìn)行后續(xù)空制的高度位零的偽類層清除 

采用CSS overflow:auto的方式撐高 

采用CSS overflow:hidden的方式產(chǎn)生怪異適應(yīng) 

采用display:table將對象變成table形式 

采用div標(biāo)簽,以及css的clear屬性 

采用br標(biāo)簽,以及css的clear屬性 

采用br標(biāo)簽,以及其自身HTML的clear屬性 

粗略的看,他們都能將問題解決;然而他們另外一方面又有著各自的利弊。(一一對應(yīng))

優(yōu)點結(jié)構(gòu)語義化完全正確,不會產(chǎn)生其余的怪異問題。

缺點復(fù)用方式不當(dāng)容易造成代碼量急劇增大。

建議最外層輕浮動時使用,或清晰模塊化復(fù)用方式的人使用。 

優(yōu)點結(jié)構(gòu)語義化完全正確,代碼量極少。

缺點多個嵌套后,點擊最外層的輕浮動框會遭成最外層至最內(nèi)層內(nèi)容全選(FF);或者在mouseover造成寬度改變時會出現(xiàn)最外層模塊有滾動條(IE)。

建議內(nèi)個模塊使用,請勿嵌套。 

優(yōu)點結(jié)構(gòu)語義化完全正確,代碼量極少。

缺點內(nèi)容增多時候極易不會自動換行而內(nèi)容被隱藏掉。

建議寬度固定時使用,請勿嵌套。 

優(yōu)點結(jié)構(gòu)語義化完全正確,代碼量極少。

缺點盒模型屬性已經(jīng)改變,可想而知奇異事件自然多得你數(shù)都數(shù)不到。

建議如果你不想改Bug改死你的話,最好不要使用;不過可以作為alpha版本當(dāng)中臨時性的忽悠下測試。 

優(yōu)點代碼量極少,復(fù)用性極高。

缺點完全不能完美的適應(yīng)語義化,不利于改版以及需求變更。

建議初學(xué)者使用,可以讓你快速的解決浮動問題。 

優(yōu)點語義化程度比第5種情況要更優(yōu);代碼量極少,復(fù)用性極高。

缺點語義化依舊不完美,不利于改版以及需求變更。

建議初學(xué)者使用,可以讓你快速的解決浮動問題。 

優(yōu)點語義化程度比第5、6種情況要更優(yōu);代碼量最少,復(fù)用性極高。

缺點語義化依舊不完美,不利于改版以及需求變更。

建議引導(dǎo)初學(xué)者思維升級時使用,讓其明白與其用classname來控制一種表現(xiàn),倒不如回歸到WEB1.0的時代的網(wǎng)頁直接用html屬性來控制表現(xiàn),畢竟后者的代碼量更少。 

最后,列舉完畢。

1
6
分享到:

0

喜歡他,就推薦他上首頁吧^_^

推薦閱讀

×

賽事服務(wù)聯(lián)系方式

0371-86068866

4008887269

cndesign@163.com

好的,我知道了

官方微信

聯(lián)系我們

  • QQ:33143335 QQ:1904200230
  • 電話:18569912460
  • 投稿:cndesign@163.com
  • 地址:鄭州市國家大學(xué)科技園東區(qū)9號樓2層

版權(quán)信息

  移動 Android 版 豫 ICP 備16038122號-2 豫公網(wǎng)安備 41019702002261號