我們在使用css對網頁元素定義樣式時經常會遇到這種情況：要對一般元素應用一般樣式，然後在更特殊的元素上覆蓋它們。那麼我們怎麼樣來保證我們所新定義的元素樣式能覆蓋目標元素上原有的樣式呢？
在css中，會根據選擇器的特殊性來決定所定義的樣式規則的次序，具有更特殊選擇器的規則優先於具有一般選擇器的規則，如果兩個規則的特殊性相同，那麼後定義的規則優先。
那麼，又怎麼來計算選擇器的特殊性呢？
下面這張圖介紹了特殊性的計算方法：
我們把特殊性分為4個等級，每個等級代表一類選擇器，每個等級的值為其所代表的選擇器的個數乘以這一等級的權值，最後把所有等級的值相加得出選擇器的特殊值。
4個等級的定義如下：
l 第一等：代表內聯樣式，如: style=」」，權值為1000。
l 第二等：代表id選擇器，如：#content，權值為100。
l 第三等：代表類，偽類和屬性選擇器，如.content，權值為10。
l 第四等：代表型別選擇器和偽元素選擇器，如div p，權值為1。
例如上圖為例，
其中#n**為二等選擇器；
.active為三等選擇器；
ul、li和a為四等選擇器。
則整個選擇器表示式的特殊性的值為1*100+1*10+3*1=113
下面是一些計算示例：
注意：通用選擇器（程式設計客棧*），子選擇器（>）和相鄰同胞選擇器（+）並不在這四個等級中，所以他們的權值都為0。
我們再來看乙個具體的例子：
假如有以下組樣式規則，你能判斷出html**中的兩個標題是什麼顏色嗎？
1 #content div#main-content h2 4 #content #main-content>h2 7 body #content div[id="main-content"] h210 11 #main-content div.paragraph h214 #main-content [class="paragraph"] h217 div#main-content div.paragraph h2.first以下是html**：
grubgqft;2 34 css（cascading style sheet，可譯為「層疊樣式表」或「級聯樣式表」）是一組格式設定規則，用於控制web頁面的外觀。
5 67 1、表現和內容相分離 2、提高程式設計客棧頁面瀏覽速度 3、易於維護和改版 4、使用css布局更符合現在的w3c標準.
8
9 判斷出來了麼？答案是：兩個標題都是紅色的！
讓我們來一起算算六個樣式規則各自的特殊性的值：
第乙個特殊性的值=2*100+2*1=202
第二個特殊性的值=2*100+1=201
第三個特殊性的值=1*100+1*10+3*1=113
第四個特殊性的值=1*100+1*10+2*1=112
第五個特殊性的值=1*100+1*10+1*1=111
第六個特殊性的值=1*100+2*10+3*1=123
清楚了吧，第乙個樣式規則以其202的高分一舉奪得了本次樣式選擇器特殊性大賽的冠軍，後面一些規則雖然看起來好像更複雜，但特殊性並不是拼誰的選擇器表示式寫得更長，id選擇器才是王道！
理解選擇器的特殊性很重要，特別是在修復bug的時候，因為你需要了解哪些規則優先及其原因。
如果你遇到了似乎沒有起作用的css規則，很可能是出現了特殊性衝突。請在你的選擇器中新增他的乙個父元素的id，從而提高它的特殊性。如果這能解決問題，就說明樣式表中其他地方很可能有更特殊的規則，它覆蓋了你的規則。如果是這種情www.cppcns.com況，你可能需要檢查**，解決特殊性衝突，讓**盡可能簡潔。
本文標題: 你必須要知道的css特殊性概念
本文位址:
grubgqft;2 34 css（cascading style sheet，可譯為「層疊樣式表」或「級聯樣式表」）是一組格式設定規則，用於控制web頁面的外觀。
5 67 1、表現和內容相分離 2、提高程式設計客棧頁面瀏覽速度 3、易於維護和改版 4、使用css布局更符合現在的w3c標準.
8
9 判斷出來了麼？答案是：兩個標題都是紅色的！
讓我們來一起算算六個樣式規則各自的特殊性的值：
第乙個特殊性的值=2*100+2*1=202
第二個特殊性的值=2*100+1=201
第三個特殊性的值=1*100+1*10+3*1=113
第四個特殊性的值=1*100+1*10+2*1=112
第五個特殊性的值=1*100+1*10+1*1=111
第六個特殊性的值=1*100+2*10+3*1=123
清楚了吧，第乙個樣式規則以其202的高分一舉奪得了本次樣式選擇器特殊性大賽的冠軍，後面一些規則雖然看起來好像更複雜，但特殊性並不是拼誰的選擇器表示式寫得更長，id選擇器才是王道！
理解選擇器的特殊性很重要，特別是在修復bug的時候，因為你需要了解哪些規則優先及其原因。
如果你遇到了似乎沒有起作用的css規則，很可能是出現了特殊性衝突。請在你的選擇器中新增他的乙個父元素的id，從而提高它的特殊性。如果這能解決問題，就說明樣式表中其他地方很可能有更特殊的規則，它覆蓋了你的規則。如果是這種情www.cppcns.com況，你可能需要檢查**，解決特殊性衝突，讓**盡可能簡潔。
本文標題: 你必須要知道的css特殊性概念
本文位址:
你必須要知道的幾個CSS技巧
有些經典的css技巧，我們還是需要記住的，這樣可以節省我們大量的時間，下面零度就為大家推薦幾個比較好的css技巧 許多網頁上都有導航選單，當進入某頁時，選單上相應這一項就應該變灰，而其他頁亮起來。一般要實現這個效果，需要寫程式或專門為每一頁做設計，現在靠css就可以實現這個效果。首先，在導航 中使用...
你必須要知道的幾個CSS技巧
1 在不同頁面上使用同樣的導航 許多網頁上都有導航選單，當進入某頁時，選單上相應這一項就應該變灰，而其他頁亮起來。一般要實現這個效果，需要寫程式或專門為每一頁做設計，現在靠css就可以實現這個效果。首先，在導航 中使用css類 然後分別為每一頁的body指定乙個id，和上面類同名。如 然後設計css...
關於 Http 協議，你必須要知道的
http協議是hyper text transfer protocol 超文字傳輸協議 的縮寫,是用於從全球資訊網伺服器傳輸超文字到本地瀏覽器的傳送協議。http 是基於 tcp ip 協議通訊協議來傳遞資料 html 檔案,檔案,查詢結果等 它不涉及資料報 packet 傳輸，主要規定了客戶端和伺...