當建立的樣式表越來越複雜時，乙個標籤的樣式將會受到越來越多的影響，這種影響可能來自周圍的標籤，也可能來自其自身。下面我們從這兩方面去看看 css 樣式的優先順序。
css 的繼承特性指的是應用在乙個標籤上的那些 css 屬性被傳到其子標籤上。看下面的 html 結構：
color: red，則這個屬性將被color: red。
由上可見，當網頁比較複雜， html 結構巢狀較深時，乙個標籤的樣式將深受其祖先標籤樣式的影響。影響的規則是：
css 優先規則1： 最近的祖先樣式比其他祖先樣式優先順序高。
例1：
如果我們把乙個標籤從祖先那裡繼承來的而自身沒有的屬性叫做「祖先樣式」，那麼「直接樣式」就是乙個標籤直接擁有的屬性。又有如下規則：
css 優先規則2：「直接樣式」比「祖先樣式」優先順序高。
例2：
上面討論了乙個標籤從祖先繼承來的屬性，現在討論標籤自有的屬性。在討論 css 優先順序之前，先說說 css 7 種基礎的選擇器：
css 優先規則3：優先順序關係：內聯樣式 > id 選擇器 > 類選擇器 = 屬性選擇器 = 偽類選擇器 > 標籤選擇器 = 偽元素選擇器
例3：
//html
//css
#content-id
.content-class
div
最終的 color 為 black，因為內聯樣式比其他選擇器的優先順序高。
當乙個標籤同時被多個選擇符選中，我們便需要確定這些選擇符的優先順序。我們有如下規則：
css 優先規則4：計算選擇符中 id 選擇器的個數（a），計算選擇符中類選擇器、屬性選擇器以及偽類選擇器的個數之和（b），計算選擇符中標籤選擇器和偽元素選擇器的個數之和（c）。按 a、b、c 的順序依次比較大小，大的則優先順序高，相等則比較下乙個。若最後兩個的選擇符中 a、b、c 都相等，則按照「就近原則」來判斷。
例4：
//html
//css
#con-id span
div .con-span
由規則 4 可見，的 color 為 red。
例5：
//html
div
div
從順序上看，內部樣式在最下面，被最晚引用，所以 的背景色為 blue。
@import語句必須出現在內部樣式之前，否則檔案引入無效。當然不推薦使用@import的方式引用外部樣式檔案，原因見另一篇部落格：css 引入方式。
css 還提供了一種可以完全忽略以上規則的方法，當你一定、必須確保某乙個特定的屬性要顯示時，可以使用這個技術。
css 優先規則5：屬性後插有!important的屬性擁有最高優先順序。若同時插有!important，則再利用規則 3、4 判斷優先順序。
例6：
//html
//css
p .father .son
雖然 .father .son 擁有更高的權值，但選擇器 p 中的 background 屬性被插入了 !important，
所以 的 background 為 red。
css樣式優先順序
多重樣式將層疊為乙個 樣式表允許以多種方式規定樣式資訊。樣式可以規定在單個的 html 元素中，在 html 頁的頭元素中，或在乙個外部的 css 檔案中。甚至可以在同乙個 html 文件內部引用多個外部樣式表。層疊次序 當同乙個 html 元素被不止乙個樣式定義時，會使用哪個樣式呢？一般而言，所有...
CSS樣式優先順序
css樣式分為內聯樣式和外部樣式，一般情況下 內聯樣式的優先順序大於外部樣式。即style樣式 id選擇器 class選擇器 元素選擇器。例如 on person num li當對li標籤新增上面兩個樣式時，on樣式中重複的內容是不會生效的。因為.on樣式的優先順序值小於li，它會被li樣式覆蓋。但...
css樣式優先順序
css樣式分類 外聯樣式，內部樣式，內聯樣式，行內樣式 標籤屬性 優先順序 行內樣式 標籤屬性 外聯樣式 內部樣式 內聯樣式，這裡的高度為110px class login class imgs 選擇器 權值內聯樣式表的權值最高 1000 id 選擇器的權值 100class 類選擇器的權值 10h...