IE6讀取不到樣式檔案bug

2022-07-05 04:06:09 字數 2250 閱讀 3305

早年的東東,貼出來充一下數吧~

在乙個彈層優化需求中,完成了修改後,刷一下其他(除ie6外)瀏覽器,很給力,展現都乙個樣:

再刷下ie6,傻眼了:

ie6問題多我知道,不過像這樣的問題還是第一次見,它不是某一處的展現問題,而是整個彈層內容……等等,整塊內容有問題,某個樣式沒有載入到?抱著這樣的猜測,google了一下,看到下面這句話:

此頁面是xx站點下的,xx下檔案統一用gb2312編碼,故將頁面的charset值改為gb2312,並將頁面檔案轉為ansi編碼:

修改後再刷下ie6,ok,木有問題了。

問題雖然解決了,但邏輯上還是說不通:

如果全域性和彈層樣式與內容樣式一樣是ansi編碼,為什麼一開始它們可以被讀取呢?

如果全域性和彈層樣式不是ansi編碼,那麼頁面編碼修改為ansi編碼後,它們和頁面的就不一致了,為什麼沒有問題呢?

認真思考了三秒鐘,無果,去請教了下bboy90,沿著他給出的思路做了下測試:

說明:樣式charset的設定有兩種方式,以gb2312為例:

方式一:在css檔案的開頭設定:

方式二:在中設定:

**中的「gb2312(樣)」指以方式一設定charset為gb2312,「gb2312(link)」指以方式二設定charset為gb2312。

從測試結果可以看出:

ok,現在我們對編碼的一致性原則有了一定的了解,再回過頭來分析上面的問題:

經查實,全域性和彈層樣式都是引用主站的,均為utf-8編碼,並且樣式檔案中沒有設定charset,即修改前:

修改後:

為什麼內容樣式的charset與編碼不一致時,會出現問題,而全域性和彈層樣式的charset與編碼不一致時就正常呢?文品問題嗎?

根據bboy90的說法,當樣式charset與編碼不一致時,若注釋符號/* */與中文內容間沒有空格(如下),則容易出現問題。

檢查了一下,果然,全域性和彈層樣式的注釋符號/* */與注釋內容間均有空格,而內容樣式的注釋符號/* */與注釋內容間多處沒有空格。

為了進一步驗證,針對內容樣式的幾條注釋進行了測試:

以上測試並不能得出什麼像樣的結論,革命尚未成功,同志仍需努力:

當我刪除「點」時,會變成這樣:

繼續往左刪兩次,更奇葩:

結合這個和前面的測試,我做了乙個大膽的猜想:

當樣式charset與編碼不一致時,樣式檔案中中文的解析會出現問題,而中文解析的錯誤會影響到緊跟在後面的*/,導致*/的解析也出錯,*/不被識別到,結果下面的樣式就以被注釋掉處理了。而新增空格等於在中文和*/間新增一緩衝地帶,中文解析錯誤時影響緊跟其後的空格,空格後面的*/就可以倖免於難了。因中文是兩個位元組的,新增兩個空格應該足以緩衝了。

因多數瀏覽器的容錯機制比較好,所以沒有問題,而ie6這個可憐娃兒先天不足、後天畸形,面對這種問題就束手無策了。

但是……

這樣的猜測還有點說不通,編輯時亂碼是發生在樣式編碼為ansi時,與樣式charset和編碼的一致性無關;而展現異常發生在樣式charset和編碼不一致性時,與編碼是否為ansi無關。

哦……忙活了半天,還是無果(淚奔)

2012.12.3

IE6常見BUG 和處理

1 ie6怪異解析之padding與border算入寬高 原因 未加文件宣告造成非盒模型解析 解決方法 加入文件宣告 2 ie6在塊元素 左右浮動 設定marin時造成margin雙倍 雙邊距 解決方法 display inline 3 以下三種其實是同一種bug,其實也不算是個bug,舉個例子 父...

IE6滑鼠懸停Bug

當滑鼠放置於某個文字鏈結之上,文字或文字背景改變為其他顏色或樣式的效果是我們最經常見到的滑鼠懸停效果。在css中,這個效果靠偽元素 hover來實現,只不過在文字鏈結中 hover被應用在了錨點元素上。實際上,在css2中,hover偽元素可以應用於任何html元素上。比如,1 p hover 這一...

ie6 常見bug解決之道

bug 1 解決div 無法遮擋 select 的問題 一現象 在調整頁面樣式時,經常發現浮動層的div被select遮擋。效果如下 二.原因 在ie中,select屬於window型別控制項,它會 擋住 所有非window型別控制項 可以這麼理解,div這樣的元件是在瀏覽器客戶區使用 渲染 的,他...