一 css的優先順序
今天有人跟我說css hack中用!important來區分ie6，因為ie6不支援!important，是的在很早以前我也是用過這種方法寫hack，但是後來就基本不用了。本來我對他誰的ie6不支援!important也沒什麼異議，可是正好在前幾天正好用個這個!important屬性解決了一個樣式優先順序的問題，而且是支援ie6的，這是為什麼呢？到底ie6支不支援!important呢？
首先我們來看看!important這個屬性的作用：!important是用來提升樣式優先順序的，我們知道樣式是有優先順序的。
我們先看看css的優先順序的幾個基本的規則：
我們可以利用!important使該樣式優先順序最高，例如：
CSS代碼：
#idA{font-size:20px}
.classA{ font-size: 12px; }
HTML代碼：
<div id=“idA” class=“classA”>我要20像素的字</div>
我們知道根據上面的規則可以看出#idA{font-size:20px}的樣式將被引用，那我們如果要12像素的字呢？
CSS代碼：
#idA{font-size:20px}
.classA{ font-size: 12px !important; }
HTML代碼：
<div id=“idA” class=“classA”>我要12像素的字</div>
這樣.classA{ font-size: 12px !important; }這個樣式就被引用了。
這種方法在優先順序低的樣式被優先順序高的樣式覆蓋，又想引用優先順序低的樣式時候非常有用！
二 !important在ie6下的一個BUG
還是看這一段代碼，
CSS代碼：
#idA{font-size:20px}
.classA{ font-size: 12px !important; }
HTML代碼：
<div id=“idA” class=“classA”>我要12像素的字</div>
大家可以在IE6下測試一下，文字是12像素的，也就是.classA{ font-size: 12px !important; }被引用了，這證明IE6是支援!important的。但是css hack中用!important來區分ie6，說ie6不支援!important又是怎麼回事呢？
原來ie6下，在同一個選取器樣式（即同一個大括弧裡面）下!important是無效的，例如：
css代碼：
.classA{ font-size: 68px !important; font-size: 12px }
HTML代碼：
<div class=“classA”>我要12像素的字</div>
這裡在ie6下是12像素的字，而其他瀏覽器下是68px的字，當然我們把樣式改一下，!important放在後面，即.classA{ font-size: 12px;font-size: 68px !important; },那麼ie6下和其他瀏覽器一樣也是68px的字。也就是在同一個選取器樣式（即同一個大括弧裡面）下!important被ie6徹底的無視了。
==============以下2009年8月1日更新==============
昨天在紫鼠的部落格上也看到了關於!important的文章，說IE8在同一個選取器樣式（即同一個大括弧裡面）下對!important的解析也是和IE6一樣的，可是我測試的情況是IE8和IE6是不一樣的，並留了言，今天我們討論了這個問題，確實他寫的他寫的代碼IE8和IE6對!important的解析是一樣的。經過比較發現，他代碼上沒有DTD的聲明，就是html代碼上面的這一句：“<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>”，神啊，在沒有DTD的聲明的情況下，在同一個選取器樣式（即同一個大括弧裡面）下，IE6，IE7，IE8對!important的解析都是無效的。還有只要有聲明文件類型的不管是html4，xhtml1.o，還有html5（“<!DOCTYPE html>”），除去ie6有上面說的BUG外其他都是正常的。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
