前幾天在整理關於@import的一些內容時（這部分的內容將會在本月底發佈在ctrip ued博客中），突然想到!important這個東西似乎現在還是有不少人認爲在IE6中是不支持的。對於這點我是完全不認同的，雖然在很早之前我也是認爲完全不支持，但後來經朋友提醒，並且測試之後的確證明了IE6是支持的，只是支持的情況不一樣而已。
對於!important在IE6的支持情況，網絡上零零星星還是找到一些，很意外我在百度百科中也看到了，所以太多的廢話也就不說了，直接看http://baike.baidu.com/view/5843374.htm這個頁面上的最後的一點代碼介紹，如果不想點擊去看的話，引用部分代碼，( # ▽ # ) 省去自己寫代碼，我好懶啊……
1 2 |
#a{with:100px !important;} /*ie6 有效*/ #a{width:50px;} |
1 |
#a{width:100px !important; width:50px;} /*ie6不支持*/ |
這兩段代碼大家可以分別在IE6中做一個測試，會發現當!important寫在一個選擇符內的時候，IE6會變得比較腦殘。這個時候我們也就可以作爲傳說中的HACK方式來處理頁面的兼容問題，但不建議這樣操作，因爲!important的優先級太高了。 (+﹏+)~
提到了優先級的話題，我能想到的一點就是以前有過幾次我作爲不合格的面試官時，問過關於!important的幾個問題，不過沒想到得到的答案比我這個不合格的面試官還要不合格。記得當時我的問題是“對於!important的看法是怎麼樣？IE6支持嗎？”，這個問題相信大家找谷哥或者度娘都可以得到答案。
偶爾我也會這樣問“如果在頁面某個標籤中寫了style屬性，如何通過CSS文件中的樣式定義來覆蓋style屬性中的樣式？”。記得當時得到比較多的答案就是“style屬性不是優先級最高了，而CSS文件中定義的樣式無論是ID還是class都沒辦法覆蓋style屬性中的樣式的。”真的是沒辦法嗎？那換個方式來說，下面這個代碼，最終是什麼顏色？
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無標題文檔</title> <style type="text/css"> #linxz {color:#FF0000;} .blog {color:#CC9502;} #linxz.blog {color:#9696C8;} </style> </head> <body> <div style="color:#488F48;" id="linxz" class="blog">文字顏色</div> </body> </html> |
嗯，答案是style屬性中的#488F48對吧？那麼這個時候，給任意一個選擇符中加上!important後呢？比如這樣：
1 |
.blog {color:#CC9502 !important;} |
顏色變了吧？
廢話完畢，又一次回顧了幾年前的內容。