本文向大家描述一下如何解決IE6的各種疑難雜症,主要從九個方面來向大家介紹,希望對你的學習有所幫助。
九步教你解決IE6的各種疑難雜症
1.使用文檔類型
盡量使用最嚴格的文檔類型,確保你的頁面運行於標准模式下。雖然用了它們,你可能不能用許多標簽,如b,s,font等,但它們都可以用CSS來代替。
或者最簡單的,這是Html5唯一認可的文檔類型,浏覽器會自動轉換為上面那個。也不要用xhtml的文檔聲明了,它原本想搞到Html成為過渡的產品,殊不知自己才是匆匆的過客。而且用了它,元素的nodeName可能會區分大小寫,非常麻煩。
2.使用position:relative
在布局中,永遠是先考慮定位布局然後才到浮動布局。IE的浮動模型令人狂抓。
3.使用display:inline
如果你一定要使用浮動,那請在後面跟緊display:inline。因為IE6存在一個很容易發生的bug。只要對塊狀容器元素設置了float和與float相同方向的margin值就會出現。如我們給div元素設置了float:left和margin-left:100px,在IE6中就會變成margin-left:200px。
4.請不要使用注釋節點
這裡涉及兩個可惡性的東西。一個是多余字符bug,可以參考本博客園的楊正祎(阿一)大大的這篇文章《歌劇院魅影bug》。第二個是IE全系列的查找API的bug,document.all,document.getElementsByTagName與document.querySelectorAll都有可能返回注釋節點。
5.懸浮效果記得使用帶有href屬性的a元素套嵌
在IE:hover只對a標簽有效,而且這標簽一定顯式設置了href屬性。
6.樣式設置中不要使用百分比
IE在計算百分比時存在問題。
7.讓元素獲取hasLayout
詳情請自行google百度這一篇偉大的學術研究《Onhavinglayout》。我們可以用el.currentStyle.hasLayout來檢測它是否獲得layout,一個獲得layout的萬能方法是zoom:1。
8.嚴格遵守(x)Html的套嵌規則
套嵌規則是定義在文檔類型中,文檔是按照它來解析的,雖然現在的浏覽器都很醒目,但為了防止它們發神經,還是小心為妙。另,雖然對於某些元素會自動閉合,我們還是自己閉合吧,養成個好習慣是非常重要的。
9.提高你的Javascrip水平
IE6許多東西都不支持或支持不好,但我們幾乎都可以用Javascript來模擬,如各種關系偽類,子元素過濾偽類,屬性偽類,目標偽類,min-width與max-width,PNG的透明問題……
【編輯推薦】