css樣式優先級

多重樣式優先級：若是外部樣式、內部樣式和內聯樣式同時應用於同一個元素，就是使多重樣式的狀況。通常狀況下，優先級以下：

（內聯樣式）Inline style >（內部樣式）Internal style sheet >（外部樣式）External style sheet 

 有個例外的狀況，就是若是外部樣式放在內部樣式的後面，則外部樣式將覆蓋內部樣式。

 

css選擇器權重計算方式一：

將特殊性分爲4個等級

a.第一等，行內樣式，權值爲1000

b.第二等，id選擇器，權值爲100

c.第三等，class選擇器，權值10

d.第四等，類型選擇器和僞元素選擇器，權值爲1

通用選擇器（*），子選擇器（>）和相鄰同胞選擇器（+）並不在這四個等級中，因此他們的權值都爲0。

But，這個計算方式實際上是有點問題的。。。

 

正確的計算方式以下所示：

CSS選擇器權重計算方式二：

1.A：若是是行內樣式，A=1,不然A=0；

2.B：計算該選擇器中ID的數量。

3.C：計算該選擇器中class、僞類、屬性選擇器等的數量。

4.D：計算該選擇器中僞元素及標籤的數量。

計算權重值時，A,B,C,D四組值，從左到右，分組比較。若是A相同，比較B，若是B相同，比較C，若是C相同，比較D，若是D相同，後定義的優先。

 

舉個栗子：樣式一：body header div navulli div p a span em {color: red}

                  樣式二：.count {color: blue}

按照計算方法一，樣式一的權重值是11，樣式二的權重值是10，若是這兩條規則用於同一個元素，則該元素應該是紅色，實際結果倒是藍色。

 

CSS 優先級法則：

A  選擇器都有一個權值，權值越大越優先；

B  當權值相等時，後出現的樣式表設置要優於先出現的樣式表設置；

C  創做者的規則高於瀏覽者：即網頁編寫者設置的CSS 樣式的優先權高於瀏覽器所設置的樣式；

D  繼承的CSS 樣式優先級低於後來指定的CSS 樣式；

E  在同一組屬性設置中標有「!important」規則的優先級最大。