css選擇器優(yōu)先級順序是怎樣的

這篇文章主要介紹css選擇器優(yōu)先級順序是怎樣的，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

首先大家應(yīng)該都知道什么是css選擇器吧？

如果我們在設(shè)計網(wǎng)頁頁面時，使用css對HTML頁面中的元素實現(xiàn)一對一，一對多或者多對一的控制，這就需要用到CSS選擇器。

而HTML頁面中的元素就是通過CSS選擇器進行控制的。

簡單來說，選擇器可以這樣理解。

每一條css樣式定義由兩部分組成，形式如下：

[code] 選擇器{樣式} [/code] 在{}之前的部分就是“選擇器”。

“選擇器”指明了{}中的“樣式”的作用對象，也就是“樣式”作用于網(wǎng)頁中的哪些元素。

那么大家可以簡單了解下css選擇器有哪些分類？

一、標簽選擇器

body,div,p,ul,li...

二、類選擇器

class="demo"
class="demo_1"

三、ID選擇器

id="name",id="name_t"

四、全局選擇器

*

五、組合選擇器

.demo .demo_1
/*兩選擇器用空格鍵分開*/

六、后代選擇器

#head .nav ul li
 /* 從父集到子孫集的選擇器 */

七、群組選擇器

div,span,img {color:blue}
/*即具有相同樣式的標簽分組顯示*/

八、繼承選擇器

div p
/*兩選擇器用空格鍵分開*/

九、偽類選擇器

link、visited、active、hover...
/* 鏈接樣式,a元素的偽類，4種不同的狀態(tài)*/

十、字符串匹配的屬性選擇符

^ $ *
/*分別對應(yīng)開始、結(jié)尾、包含*/

十一、子選擇器

div>p
/* 帶大于號>*/

十二、CSS 相鄰兄弟選擇器

h2+p
/*  帶加號+ */

了解完css分類，大家也需要簡單了解下什么是層疊性？

層疊性：就是css處理沖突的能力。層疊性是一種能力。當多個選擇器描述了同一個屬性的時候，這個屬性到底應(yīng)該聽誰的？

那么下面我們給大家總結(jié)了css選擇器的優(yōu)先級順序！

css優(yōu)先級高低排序：!important > 行內(nèi)樣式>ID選擇器 > 類選擇器 > 標簽 > 通配符 > 繼承 > 瀏覽器默認屬性

這個排序的根據(jù)主要是因為每個選擇器都有自己的權(quán)重，每條css規(guī)則都包含一個權(quán)重級別，這個級別是不同的選擇器加權(quán)計算得來的。不同級別的權(quán)重會產(chǎn)生不同的樣式，不同的樣式會在你的網(wǎng)頁中表現(xiàn)出來。

以上是“css選擇器優(yōu)先級順序是怎樣的”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注億速云行業(yè)資訊頻道！