CSS樣式優先順序

2021-10-09 08:14:25 字數 1174 閱讀 4260

css選擇器如下:

1. 標籤名選擇器 div /即頁面中的各個標籤名的css樣式

2.類選擇器 .divclass /即定義的每個標籤的class 中的css樣式

3.id選擇器 #mydiv /即頁面中的標籤的id

4.後代選擇器(類選擇器的後代選擇器) .divclass span /即多個選擇器以逗號的格式分隔 命名找到準確的標籤

5.群組選擇器 div,span,img /即具有相同樣式的標籤分組顯示

他們的優先順序順序如下:

!important > 內聯 > id > 類 > 標籤 | 偽類 | 屬性選擇 > 偽物件 > 繼承 > 萬用字元

根據css規範,具體性越明確的樣式規則,權重值越高

id選擇器權重=100

類選擇器權重=10

標籤選擇器權重=1

選擇器相加最後的權重越高,優先順序越高

/例如:id選擇器+標籤選賊=100+1=101/

lang

="en"

>

>

charset

="utf-8"

>

name

="viewport"

content

="width=device-width, initial-scale=1.0"

>

>

documenttitle

>

>

div.ni

div .ni

.ni .p1 .u .si a

astyle

>

head

>

>

class

="ni"

>

class

="p1"

>

class

="u"

>

class

="si"

>

>

worlda

>

li>

ul>

div>

div>

body

>

html

>

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...