之前在某個前端技術(shù)群中與高手討論‘!important是否為IE BUG，怎樣設(shè)計示例進行驗證’的問題。當(dāng)時我舉的示例是引用網(wǎng)上前輩的例子：

#test?{
????color:red?!important;/*IE7、FF、OP等顯示紅色文字*/
????color:green;/*IE6顯示綠色文字*/
}

當(dāng)時被駁回，理由是這個示例沒有說服力。后來自己想想，確實，這個例子應(yīng)該只能算是一個特例，是一種表面現(xiàn)象，而要說服別人相信你的觀點，就必須說出實質(zhì)的東西。最近再次研究CSS特殊性、繼承和層疊等技術(shù)，現(xiàn)在的理解應(yīng)該更進一步了吧，至少我是把自己給說服了——!important 確實是IE BUG！

為了更好地說明實質(zhì)性的原理，有必要真正了解CSS重要性（!important）。當(dāng)然，要真正說明清楚還必須了解特殊性、繼承和層疊等，但這些不是本文敘述的范圍。

在CSS優(yōu)先級規(guī)則中，!important 處于最高的優(yōu)先級，其權(quán)重之高優(yōu)先于內(nèi)聯(lián)樣式。了解CSS特殊性的同仁應(yīng)該非常清楚，內(nèi)聯(lián)樣式具有至高的優(yōu)先級（優(yōu)先級為1,0,0,0，ID選擇器的優(yōu)先級次之：0,1,0,0），但碰到 !important 的時候，內(nèi)聯(lián)樣式要略遜一籌（這里假設(shè)內(nèi)聯(lián)樣式中沒有設(shè)置!important）。舉個例子：

span?{color:gray?!important;}

以上樣式應(yīng)用到以下的結(jié)構(gòu)：

<span?style="color:blue;">我會顯示為什么顏色呢？</span>

經(jīng)驗證，文本‘我會顯示為什么顏色呢？’將在瀏覽器（包括IE6）中顯示為灰色（gray）。這個結(jié)果說明，瀏覽器（包括IE6）都能夠正常解析 !important 。

然而，當(dāng)我們稍稍改變一下樣式表：

span?{
????color:gray?!important;/*IE6將不會將文本顯示為灰色(gray)*/
????color:red;
}

應(yīng)用了以上樣式表之后，文本將會顯示為什么顏色呢？？經(jīng)驗證，IE7、FF、OP均依舊顯示為灰色（color:gray），而IE6則顯示為藍(lán)色（color:blue）！

為什么會出現(xiàn)這種結(jié)果呢？BUG！！

真的是BUG嗎？讓我在修改一下樣式表：

span?{
????color:gray?!important;/*IE6將依舊不會解析該規(guī)則*/
????padding:8px;
????line-height:25px;
????vertical-align:middle;
????color:red;
}

我在兩個color屬性之間隨意添加幾條規(guī)則，結(jié)果與沒有那幾條規(guī)則的結(jié)果是完全一樣的，即，IE6將文本顯示為藍(lán)色（color:blue）。

好吧，如果以上的改動不能說明實質(zhì)性的問題，那么我再次修改了樣式表：

span?{
????color:gray?!important;/*嘿，IE6終于‘看到’!important了*/
}
span?{
????color:red;
}

以上規(guī)則，如果沒有 !important ，則根據(jù)層疊規(guī)則，color:red 會將 color:gray 覆蓋掉，而內(nèi)聯(lián)樣式 color:blue 再將 color:red 覆蓋掉——但是有了 !important 之后，一切都必須因此而‘改觀’——瀏覽器（包括IE6）將文本顯示為灰色（color:gray !important）！

?

綜上所述，!important 是能夠被IE6解析了，而之所以會碰到以上IE6不能解析 !important 的情況，是因為將兩個相同的規(guī)則編入同一個規(guī)則分組（有!important的規(guī)則在前）時就構(gòu)成了IE6的BUG

參考資料：《CSS權(quán)威指南：第三版》 Eric A.Meyer著

轉(zhuǎn)載于:https://www.cnblogs.com/wangbin/archive/2010/11/06/1870638.html

總結(jié)

以上是生活随笔為你收集整理的解析并验证IE6及之前版本的'!important’ BUG(转)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。