1.層疊選擇器的優先順序:
瀏覽器預設 《外部樣式表 < 內部樣式表 《內聯樣式
其中,樣式表優先順序:
類選擇器 < 類派生選擇器 < id選擇器 < id派生選擇器
生選擇器以前叫上下文選擇器，所以完整的層疊優先順序是:
瀏覽器預設 < 外部樣式表 < 外部樣式表類選擇器 < 外部樣式表類派生選擇器 < 外部樣式表id選擇器 < 外部樣式表id派生選擇器 < 內部樣式表 < 內部樣式表類選擇器 < 內部樣式表類派生選擇器 < 內部樣式表id選擇器 < 內部樣式表id派生選擇器 < 內聯樣式...共12個優先順序.
為了說明該問題，請參見下面的例子說明。
<
html
>
<
head
>
<
title
>
title
>
<
style
type="text/css"
>
div /* 綠色 */
.a1 /* 藍色 */
.a1 div /* 青色 */
.a2 /* 紅色 */
#a2 /* 黃色 */
#a2 div /* 紫色 */
style
>
head
>
<
body
>
<
div>我是綠色，內部樣式表優先於瀏覽器預設
div>
<
divclass="a2"
>我是紅色，類選擇器優先於內部樣式表
div>
<
divclass="a2"
id="a2"
>我是黃色，id選擇器優先於類選擇器
div>
<
divclass="a1"
>
<
span
>我是藍色，類選擇器優先於內部樣式表
span
>
<
div>我是青色，類派生選擇器優先於類選擇器
div>
<
divclass="a2"
>我還是青色，類派生選擇器優先於所有類選擇器
div>
<
divid="a2"
>
<
span
>我是黃色，id選擇器優先於類派生選擇器
span
>
<
div>我是紫色，id派生選擇器優先於類派生選擇器
div>
<
divclass="a1"
>我還是紫色，id派生選擇器優先於所有類選擇器
div>
<
divclass="a1"
id="a1"
>我還是紫色，id派生選擇器優先於所有id選擇器
div>
<
divclass="a1"
id="a1"
style="color:#000000;"
>我是黑色，內聯樣式駕到閒雜人等退下
div>
div>
div>
body
>
html
>
CSS樣式定義的優先順序順序總結
css樣式定義的優先順序順序總結 層疊優先順序是 瀏覽器預設 外部樣式表 內部樣式表 內聯樣式 其中樣式表又有 類選擇器 類派生選擇器 id選擇器 id派生選擇器 派生選擇器以前叫上下文選擇器，所以完整的層疊優先順序是 瀏覽器預設 外部樣式表 外部樣式表類選擇器 外部樣式表類派生選擇器 外部樣式表i...
CSS樣式定義的優先順序順序總結
css樣式定義的優先順序順序總結 層疊優先順序是 瀏覽器預設 外部樣式表 內部樣式表 內聯樣式 其中樣式表又有 類選擇器 類派生選擇器 id選擇器 id派生選擇器 派生選擇器以前叫上下文選擇器，所以完整的層疊優先順序是 瀏覽器預設 外部樣式表 外部樣式表類選擇器 外部樣式表類派生選擇器 外部樣式表i...
css 優先順序
當我們的css樣式中，如果同個元素有兩個或以上衝突的css規則，瀏覽器有一些基本的規則來決定哪乙個非常特殊而勝出，也就是常講的css優先順序。一般情況下，你不必擔心css樣式衝突，但對於大型而且複雜的css樣式檔案，或有很多css檔案組成的，就非常有可能產生衝突。下面我們通過2個簡單的例項來了解一下...