ie6錯位的幾種情況分析
由于IE6的使用人群非常廣泛,這就導(dǎo)致所有的網(wǎng)站開發(fā)人員都得向IE6的網(wǎng)頁標(biāo)準(zhǔn)看齊。為了能讓網(wǎng)站在IE6下可以正常顯示,不知花費(fèi)了多少開發(fā)人員的休息時間來加班調(diào)試。甚至有些網(wǎng)站干脆只針對IE6進(jìn)行支持,使用其他瀏覽器瀏覽時會導(dǎo)致網(wǎng)頁錯位或者不響應(yīng)等問題。
今天做了個項(xiàng)目,做到一半用瀏覽器測試了一下,所有瀏覽器都正常,就是ie6下錯位,css找了半天頭都大了,還是多出1像素,但是檢查所有都正常,郁悶,之后發(fā)現(xiàn)了ie6一般出現(xiàn)錯位的幾種情況(備用+分享):
IE6錯位一般有兩種情況。
一種是,你把所有像素都填滿了,例如900px,你左,200,中500,右200,在其他都沒有問題,理論上也對,可是IE6不行。所以你必須得稍減到幾像素才可以,例如200+498+200,這樣可以解決這個問題,其實(shí)一般設(shè)計(jì)左右之間都有空。如果左右結(jié)構(gòu)的話,一般是左邊200加一個空20再加上680,其實(shí)你只要設(shè)置左float:left,右float:right就行了。中間的20就留它去自行決擇,這樣左右錯位就解決了。
第二種就完全是你css設(shè)置的問題了。如果左中右結(jié)構(gòu) 左中都設(shè)置成float:left,右設(shè)置成float:right,中和右的空可以不管,可是左中為了留空必須在中的css 里加上margin-left:10px才可以解決,切記一定要加上display:inline。否則在ie6下面,margin-left:10 px就變成20px;
一般情況下錯位都是由于上兩種原因造成的,也有的是可能因?yàn)槎荚O(shè)置好寬度了,但里面的內(nèi)容超過了這個寬度,你只要在個css加上over-flow:hidden.就行了。
現(xiàn)在的網(wǎng)站開發(fā)人員,為了支持所有瀏覽器的同時支持IE6, 添加的獨(dú)立代碼要達(dá)幾十甚至幾百行。為了兼容IE6,開發(fā)人員浪費(fèi)了很多時間和精力。
【編輯推薦】