這篇文章主要介紹了淺談CSS層疊機制的相關資料,層疊機制可以解決作者（寫代碼的人），用戶（瀏覽頁面的人）和用戶代理（一般指瀏覽器）的樣式衝突,現在分享給大家，也給大家做個參考。
css中為什麼要有層疊機制
因為css中可能會有多個樣式同時影響同一個元素的某個屬性，層疊機制可以解決作者（寫程式碼的人），使用者（瀏覽頁面的人）和使用者代理程式（一般指瀏覽器）的樣式衝突。
在層疊中每個樣式規則都有一個權重值，當其中幾條規則同時生效時，權重最大的規則優先。一般來說作者指定的樣式權重值高於使用者樣式權重值，使用者樣式權重高於客戶端（使用者代理）權重值。一般權重值跟對象，是否有！ important,特異度和位置先後有關。在層疊順序中，以下權重值從小到大
（1）使用者代理樣式
#（2）使用者一般樣式
（3）作者一般樣式
（4）作者重要樣式（！important）
（5）使用者重要樣式（！important）
（6）如果是兩個樣式來自相同的程式碼，如都來自作者（代碼），並且它們的樣式聲明同樣重要，則根據特異度來計算，特異度高的會覆蓋特異度低的
（7）如果特異度也相同，則越往後的樣式優先順序越高
為什麼使用者設定的重要樣式比作者重要樣式優先順序高，這樣做的原因是為了方便使用者實現一些特殊的要求，例如頁面字體大小的調整等。
選擇器特異度的計算
#（1）如果一個宣告出現在元素的style屬性中，則將a計為1；
（2）b等於選擇器中所有ID選擇器加起來的數量和
（3）c等於選擇器中所有class選擇器和屬性選擇器，以及偽類選擇器加起來的數量和
（4）d等於選擇器中所有標籤選擇器和偽元素選擇器加起來的數量和
a-b-c-d即是選擇器的特異度，比較順序從a先比起，誰先大則優先權就越高。
注意：
繼承的優先權最低，沒有特異度
結合符（如，>）及通用選擇符（*）特異性為0
.box{} /*特异度=0，0，1，0*/
.box p{} /*特异度=0，0，1，1*/
#nav li{} /*特异度=0，1，0，1*/
p:first-line{} /*特异度=0，0，0，2*/
style="" /*特异度=1，0，0，0*/以上就是本文的全部內容，希望對大家的學習有幫助，更多相關內容請關注PHP中文網！
相關推薦：
以上是CSS中層疊機制的解析的詳細內容。更多資訊請關注PHP中文網其他相關文章！
