剛學習css層疊樣式表的時候，對這種情況下元素的最終樣式比較困惑。比如下面這段代碼：
h1{ color: red; }
body h1{color:green;}<pre name="code" class="css"><body>
<h1>我該顯示哪個顏色？</h1>
</body>對同一個元素設置樣式，這個看似是衝突的，最終這個<h1>會使用哪個樣式，紅色還是綠色？
答案就在於選擇器的特殊性。擁有最高特殊性的屬性申明就使得<h1>元素顯示申明對應的顏色。這個例子中，前者申明的特殊性爲0,0,0,1，而後者的特殊性爲0,0,0,2 。所以後者的特殊性高，最終<h1>現實的顏色就green。
腦補一下：選擇器的特殊性有選擇器組件確定的。特殊性表述爲4部分，如：0,0,0,0。一個選擇器的具體的特殊性怎麼確定，有下面這幾種規則：
1、對於選擇器中的各個ID屬性值（元素的id=“xxx”），特殊性就就加 0,1,0,0。
2、對於選擇器中的各個類屬性值（元素的class=“xxx”）、屬性選擇(如：p[href] )和僞類（如： :lang(), :first-child(), :focus() :link() :visited() :hover() :active()）特殊性就加0,0,1,0。
3、對於選擇其中給定的各個具體的元素（如 ：p ，span， h1~h6，body，section ，video，article ）和僞元素（如： :first-letter :first-line :before :after）特殊性就加0,0,0,1
4、內聯聲明的特殊性最高（如： <h1 style="color:green;">這是大標題</h1>）,特殊性爲1,0,0,0。【在css2.0中它的特殊性爲0,1,0,0 ，在css2.1中爲1,0,0,0】
5、（特殊的地方）結合符合通配選擇器（*）對特殊性沒有貢獻。
舉幾個栗子：
h1{color:maroon;} /*特殊性爲 = 0,0,0,1*/
#test{background:#747474;} /*特殊性爲 =0,1,0,0 */
#test .content{font-size:16px;} /*特殊性爲 = 0,1,1,0*/
div #sidebar *[src]{color:#fff;} /*特殊性爲 = 0,1,1,1*/
對於引用第三方庫，想修改中間的某些樣式，直接複製選擇器，在自己的css文件中重寫樣式，後面寫的就會覆蓋庫中的樣式。