所有開發(fā)前端的學(xué)生都必須知道,IE6是兼容BUG多瀏覽器,不支持PNGalpha暫時(shí)不管通道。其文檔的分析和理解規(guī)范也引起了許多煩人BUG,有時(shí)甚至讓人感到絕望。本文主要講解一些容易遇到的事情。IE6BUG,以及解決方案。一、IE6雙倍邊距bug使用頁(yè)面上的元素float無(wú)論是向左還是向右浮動(dòng);只要元素有margin像素會(huì)使值乘以2,例如margin-left:10px”在IE6.該值將分析為20px。想解決這個(gè)問(wèn)題BUG需要在加元素display:inline或display:block明確其元素類型可以解決雙邊距BUG二、IE6中3像素問(wèn)題及解決方案當(dāng)元素使用float浮動(dòng)后,元素與相鄰元素之間會(huì)產(chǎn)生3px的間隙。奇怪的是,如果右側(cè)的容器沒(méi)有設(shè)置高度3px間隙位于相鄰容器內(nèi)部,設(shè)定高度后跑到容器的相反側(cè)。要解決這類BUG如果需要在同一行添加布局的元素float浮動(dòng)。三、IE6中奇數(shù)寬高BUGIE6中奇數(shù)的高寬顯示大小與偶數(shù)的高寬顯示大小不同。問(wèn)題在于奇數(shù)高寬。為了解決這些問(wèn)題,我們只需要嘗試定位外部位置div高寬可以寫成偶數(shù)。四、IE圖片鏈接鏈接下方有間隙IE圖片下方會(huì)有一定的間隙,尤其是圖片垂直靠近圖片時(shí)。要解決這類問(wèn)題,需要解決img標(biāo)簽定義為display:block或定義vertical-align對(duì)應(yīng)屬性。也可以為img寫入相應(yīng)的樣式font-size:0五、IE6下空元素的高度BUG如果一個(gè)元素沒(méi)有任何內(nèi)容,在樣式中設(shè)置0-19px兩者之間的高度。這個(gè)元素的高度一直是19px。有四種解決方案:1.在元素的css中加入:overflow:hidden2.插入元素html注釋:<!–>3.插入元素html的空白符:&nbsp;4.在元素的css中加入:font-size:0六、重復(fù)文字BUG在一些復(fù)雜的排版中,有時(shí)會(huì)出現(xiàn)浮動(dòng)元素后面的字符clear去除元素下面。解決方案如下:1.確保所有元素都有display:inline2.在后一個(gè)元素上使用margin-right:-3px3.為浮動(dòng)元素的后一個(gè)條目添加條件注釋,<!–[if!IE]>xxx<![endif]–>4.在容器的后元素使用一個(gè)空白的div,為這個(gè)div指定不超過(guò)容器寬度。七、IE6中z-index失效具體BUG為了設(shè)置元素的父級(jí)元素z-index為1,然后設(shè)置子級(jí)元素z-index當(dāng)它失敗時(shí),它的級(jí)別將繼承父級(jí)元素的設(shè)置,導(dǎo)致某些級(jí)別的調(diào)整BUG。可以閱讀詳細(xì)的解釋IE在中部情況下z-index無(wú)效的原因和解決方案結(jié)論:實(shí)際上IE6中,很多BUG可以使用解決方案display:inline、font-size:0、float解決。所以寫代碼的時(shí)候要記住,一旦用了float浮動(dòng)增加了元素display:inline樣式可以有效避免浮動(dòng)造成的樣式混亂。使用空DIV為了避免其對(duì)布局美觀的高度影響,也可以添加font-size:很容易避免一些兼容性問(wèn)題。