選擇器的權重

樣式

權值內聯樣式

1，0，0，0

id選擇器

0，1，0，0

類和偽類選擇器

0，0，1，0

元素選擇器

0，0，0，1

通配選擇器

0，0，0，0

繼承的樣式

沒有優先順序

注：1、比較優先順序時，需將所有的選擇器權值相加計算（相加是按位相加，不會進製），總的權值越高，優先順序越高。但分組選擇器是單獨計算，不相加。

2、選擇器的累加不會超過其最大數量級，比如：11個類選擇器累加不會超過id選擇器的值。其只在第二位累加，無法加到第三位。

3、如果優先順序計算後相同，則使用後面設定的樣式。

4、可以在樣式的最後邊加上 ！important，此時該樣式會獲得最高優先順序，甚至超過內聯樣式。（實際開發中慎用）

lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
/* 此時發生樣式的衝突，div被設定為綠色 */
div.red
/* 此時加了元素選擇器後加了！important，其成為最高優先順序 */
#box
div/* 選擇器權值累加,此時選擇器的權值為0,1,0,1 */
div#box
style
>
head
>
>
"box"
class
="red"
>
我是乙個div
div>
body
>
html
>

選擇器的權重

樣式的衝突 當我們通過不同的選擇器，選中相同的元素，並且為相同的樣式設定不同的值時，此時就發生了樣式的衝突。發生樣式衝突時，應用哪個樣式由選擇器的權重 優先順序 決定 選擇器的權重 內聯樣式 1,0,0,0 id選擇器 0,1,0,0 類和偽類選擇器 0,0,1,0 元素選擇器 0,0,0,1 通配...

css選擇器 權重

基礎選擇器 一 標籤選擇器 p h1 css不區分大小寫，建議小寫 1 所有的標籤都可以作為標籤選擇器去使用 2 無論這個標籤藏多深，一定能夠被選上 3 選擇頁面所有的，而不是具體某乙個 標籤選擇器，選擇的是頁面上所有這種型別的標籤，所以經常描述 共性 無法描述某乙個元素的 個性 的。二 id選擇器...

CSS選擇器權重問題

原則一 繼承不如指定 原則二 id class 標籤選擇符 原則三 越具體越強大 原則四 標籤 id id 標籤.class class css優先順序包含四個級別 標籤內選擇符，id選擇符，class選擇符，元素選擇符 以及各級別出現的次數 根據這四個級別出現的次數計算得到css的優先順序。css...