css選擇器優先級

important>內聯>id>class = 屬性 = 偽類 >標簽 = 偽元素 > 通配符（*）

1. important聲明 1,0,0,0
2. ID選擇器 0,1,0,0
3. 類選擇器 0,0,1,0
4. 偽類選擇器 0,0,1,0
5. 屬性選擇器 0,0,1,0
6. 標簽選擇器 0,0,0,1
7. 偽元素選擇器 0,0,0,1
8. 通配符選擇器 0,0,0,0

有人說外部樣式<內部樣式,其實不然，其實外部樣式=內部樣式，誰在前面定義誰就被覆蓋

class = 屬性 = 偽類：例如.className的優先級和[class='className']和:hover的優先級是一樣的，甚至.className的優先級和[id='idName']和:hover的優先級也是一樣

空格和>的優先級是一樣的，例如body b和body>b是一樣的優先級

~和+的優先級是一樣的，例如body~b和body+b是一樣的優先級

偽元素的優先級和標簽選擇器的優先級一樣，但是我們往往會遇到一些問題，例如：

::selection{
    color: red;
}
div{
    color:black!important;
}

被選中的文字還是紅色的，不會被黑色樣式覆蓋，其原因是這里的black!important是作用在了::selection的父元素而不是直接作用在::selection上，

而我們調用偽元素的時候必須要寫上偽元素不能像其他元素一樣只寫它的class或者id或者[attr='~~~'],所以要判斷關於偽元素的優先級，都是看它前面的css選擇器的優先級