原文鏈接: http://blog.csdn.net/lzgs_4/article/details/43446303
CSS的選擇器是有權重的，當不同選擇器的樣式設置有衝突時，會採用權重高的選擇器設置樣式。權重（即優先級）的規則如下，權重越高，優先級越高：
同一個元素可以使用多個規則來指定它的同一樣式（比如字體顏色），每個規則都有自己的選擇器。顯然最終只有一個規則起作用（不可能一個字既是紅色又是綠色），那麼該規則的特殊性最高，特殊性即css優先級。很多人僅僅知道選擇器優先級：ID>class>元素選擇器，而不知道ID的優先級爲什麼大於class的優先級。那麼css優先級到底是怎麼計算的呢？
選擇器的特殊性值表述爲4個部分，用0,0,0,0表示：
- 行間樣式，加1,0,0,0.
- ID選擇器的特殊性值，加0,1,0,0。
- 類選擇器、屬性選擇器或僞類，加0,0,1,0。
- 元素和僞元素，加0,0,0,1。
- 通配選擇器*對特殊性沒有貢獻，即0,0,0,0。
- 最後比較特殊的一個標誌!important（權重），它沒有特殊性值，但它的優先級是最高的，爲了方便記憶，可以認爲它的特殊性值爲1,0,0,0,0。
選擇器特殊性值是從左向右排序的，特殊性值1,0,0,0大於以0開頭的所有特殊性值，即便它是0,99,99,99，優先級依然比1,0,0,0要低。
很多人都知道a標籤有四種狀態：鏈接訪問前、鏈接訪問後、鼠標滑過、激活，分別對應四種僞類:link、:visited、:hover、:active，並且這四個僞類如果對同一個元素設置同一個屬性，那它們的聲明順序還有一定要求，一般大家都遵循“愛恨原則LVHA”（LoVe HAte），爲什麼是這個順序？不能是其它順序嗎？
根據css優先級計算規則，僞類的特殊性值是0,0,1,0，4個僞類的特殊性值相同，那麼後面聲明的規則優先級高。當鼠標滑過a鏈接時，滿足:link和:hover兩個僞類，要改變a標籤的顏色，就必須將:hover僞類在:link僞類後面聲明；同理，當鼠標點擊激活a鏈接時，同時滿足:link、:hover、:active三種狀態，要顯示a標籤激活時的樣式（:active），必須將:active聲明放到:link和:hover之後。因此得出LVHA這個順序。這個順序能不能變？可以，但也只有:link和:visited可以交換位置，因爲一個鏈接要麼訪問過要麼沒訪問過，不可能同時滿足，也就不存在覆蓋的問題。
前面提到!important屬性，!important是用來使IE6和IE7、IE8、火狐(Firefox)、google等瀏覽器做兼容的，但IE6不能執行!important。當 !important 規則被應用在一個樣式聲明中時,該樣式聲明會覆蓋CSS中任何其他的聲明, 無論它處在聲明列表中的哪個位置. 儘管如此, !important規則還是與優先級毫無關係.使用 !important不是一個好習慣，因爲它改變了你樣式表本來的級聯規則，從而難以調試。
在使用!important時需要注意：
- Never 永遠不要在全站範圍的 css 上使用 !important
- Only 只在需要覆蓋全站或外部 css（例如引用的 ExtJs 或者YUI ）的特定頁面中使用 !important
- Never 永遠不要在你的插件中使用 !important
- Always 要優化考慮使用樣式規則的優先級來解決問題而不是 !important
什麼時候應該使用：
A) 一種情況
你的網站上有一個設定了全站樣式的CSS文件，同時你（或是你同事）寫了一些效果通常都是很差的行內樣式（行內樣式的優先級是最高的）。在這種情況下，你就可以在你全局的CSS文件中寫一些!important的樣式來覆蓋掉那些直接寫在元素上的行內樣式。
B) 另一種情況
在外層有 #someElement 的情況下，你怎樣能使 awesome 的段落變成紅色呢？這種情況下，如果不使用!important，第一條規則永遠比第二條的優先級更高。
怎樣覆蓋掉 !important：
很簡單，你只需要再加一條!important 的CSS語句，將其應用到更高優先級的選擇器（在原有基礎上添加額外的標籤、class或id選擇器）上；或是保持選擇器一樣，但添加的位置需要在原有聲明的後面（優先級相同的情況下，後邊定義的會覆蓋前邊定義的）。
或：
