選擇器與優先順序

2021-09-29 22:13:59 字數 779 閱讀 4630

css選擇器大體分為三類,即id選擇器、class選擇器、標籤選擇器。

用法如下:

id選擇器: #id名

class選擇器 :.class名

標籤選擇器: 標籤名

其中又可以不同方式組合

如下:後代選擇器: 父代名 後代名

子代選擇器:父代名》子代名

群組選擇器: #name1, .name2, #name div

偽類選擇器: name:偽類

通用(萬用字元)選擇器:*

最高優先順序是 (直接在標籤中的設定樣式,假設級別為1000)

次優先順序是(id選擇器 ,假設級別為100) #mydiv

其次優先順序是(類選擇器,假設級別為10).divclass

最後優先順序是 (標籤選擇器,假設級別是 1) div

其它選擇器的優先順序就可以計算了

優先順序由高到低分別是:

!important

內聯(1,0,0,0)

id: (0,1,0,0)

類:(0,0,1,0)

偽類/屬性(0,0,1,0)

元素:(0,0,0,1)

萬用字元繼承

使用的規則也很簡單,就是選擇器的權值加到一起,大的優先如果權值相同,後定義的優先。雖然很簡單,但如果書寫的時候沒有注意,很容易就會導致css的重複定義,**冗餘。

需要注意的是:

權值的大小跟選擇器的型別和數量有關

樣式的優先順序跟樣式的定義順序有關

選擇器優先順序 CSS選擇器優先順序總結

css選擇器優先順序這個問題,相信有點經驗前端都會認為非常簡單,但是我們今天還是來總結一下吧。相信大家應該很少直接在html頁面寫樣式吧,一般都是用link標籤匯入css樣式表。使用者自定義樣式表就是我們用link標籤引入的css樣式表,為了保持不同瀏覽器下樣式相同,所以我們的自定義樣式表一般都會覆...

選擇器,優先順序

內聯式css樣式表就是把css 直接寫在現有的html標籤中,如下面 這裡文字是紅色。盡量不要把css 寫成內部樣式 縮排統一。2.嵌入式css樣式,就是可以把css樣式 寫在標籤之間。3.外部式css樣式 也可稱為外聯式 就是把css 寫乙個單獨的外部檔案中,這個css樣式檔案以 css 注意 1...

選擇器優先順序

css優先順序 是由四個級別和各級別的出現次數決定的。四個級別分別為 行內選擇符 id選擇符 類別選擇符 元素選擇符。優先順序的演算法 每個規則對應乙個初始 四位數 0 0 0 0 若是 行內選擇符,則加1 0 0 0 若是id選擇符,則加0 1 0 0 若是 類選擇符 屬性選擇符 偽類選擇符,則分...