# 20230408 CSS權重計算

### 一般權重
以a、b、c三種權重比較，比較順序a->b->c，如果權重相同，就是看誰比較晚宣告：
a: ID Selectors
b: Class/Attribute/Pseudo-Element Selectors
c: Type/Pseudo-Element Selectors
`*Universal不算權重`


parent的屬性自動被繼承時，後child也有指定該屬性，就不會繼承parent的
例如color是個可以從父層繼承到子層的屬性


當有指定到該屬性，就需要比權重


### 特殊權重
#### inline style


#### !important
若inline style加上!important就真的權重無限大

#### Cascade Layer
定義方式: @layer name {...(一般CSS語法)...}
規則:
1. 後定義的會優先於先定義的


2. 也可以不給名字，會是一個匿名層


3. 沒有包@layer的會優先於所有有包@layer的


4. 可使用巢狀結構定義，外層會優先於內層


5. 可在最前面宣告順序，越後面越優先


6. 有使用@layer的內容，當其layer優先權較高時，即使一般權重較小仍會被套用


7. inline style 與 !important在@layer中仍勝過一切