前面的話
層疊樣式表CSS最基本的一個特性就是層疊。沖突的聲明通過層疊進行排序，由此確定最終的文檔表示。而這個過程的核心就是選擇器及其相關聲明的特殊性、重要性、來源及繼承機制。本文將詳細介紹CSS層疊
特殊性
選擇器的特殊性由選擇器本身的組件確定。特殊性值表述為4個部分(如：0,0,0,0)。下面來介紹不同的選擇器的特殊性值
1、內聯樣式 -> 1,0,0,0
2、ID屬性值 -> 0,1,0,0
3、類屬性值、屬性選擇或偽類 -> 0,0,1,0
4、元素或偽元素 -> 0,0,0,1
5、結合符和通配選擇器 -> 0,0,0,0
特殊性的值是從左向右排序的，特殊性值1,0,0,0大于以0開頭的所有值，而無論后面是什么數。在一組規則中，特殊性最高的規則勝出
h1{} -> 0,0,0,1
p em{} -> 0,0,0,2
.grape{} -> 0,0,1,0
*.bright{} -> 0,0,1,0
p.bright em.dark{} -> 0,0,2,2
#id121{} -> 0,1,0,0
div#side *[href]{} -> 0,1,1,1
重要性
有時某個聲明可能非常重要，超過了所有其他聲明，CSS2.1稱之為重要聲明。重要聲明在聲明的結束分號之前插入!important來標志，如果!important放在聲明的任何其他位置，整個聲明都將無效
如果一個聲明是重要聲明，則超過所有的非重要聲明
繼承
繼承是從一個元素向其后代元素傳遞屬性值所采用的機制。基于繼承機制，樣式不僅可以應用到指定的元素，還會應用到它的后代元素
在兩個比較特殊的情況需要注意：一個是在HTML中，應用到body元素的背景樣式可以傳遞到html元素；另一個是<a>標簽不會繼承父元素的文本樣式
[注意]繼承的屬性沒有特殊性
來源
CSS按來源的不同分為3類：author(作者)、user(用戶)、user agent(代理)
1、author(作者): 來自文檔的樣式文件。我們平常所寫的樣式基本上都是這一類的
2、user(用戶): 用戶指定的自定義的樣式文件。一些UA允許用戶導入自定義的樣式文件
3、user agent(代理): 一些UA(如：瀏覽器)要為某些元素預設一個默認的樣式，以方便閱讀
關于用戶CSS因為不常見，可能一些朋友不太理解。IE可以通過Internet 選項 -> 外觀 -> 輔助功能 -> 用戶樣式表來指定樣式文件。Chrome可以使用Stylish擴展來實現
層疊
CSS層疊樣式表的層疊特性就是讓樣式層疊在一起，通過特殊性、重要性、來源及繼承機制來排列層疊樣式的順序及選出勝出者
1、首先，按照來源及重要性排序。在不考慮重要性的前提下，優先級順序為：author(作者) > user(用戶) > user agent(代理)。但是，如果考慮重要性，則user(用戶)的優先級大于author(作者)的優先級，這樣做是試圖平衡author(作者)和user(用戶)。所以，最終的優先級排序為：user(用戶)!important > author(作者)!important > author > user > user agent
2、接著，對于非重要聲明來說，按照特殊性排序。特殊性越高的規則，權重越大
3、最后，如果特殊性相同，則按照出現順序排序。聲明在樣式表或文檔中越靠后出現，權重越大。如果樣式表中有通過@import導入的樣式表，一般認為出現在導入樣式表中的聲明在前，主樣式表的所有聲明在后
文章列表
留言列表
