計算 CSS 特異性，判斷哪條規則會生效
貼上選擇器即可計算特異性，或貼上 CSS 與元素，查看實際套用的規則。
- 在您的裝置上執行
- 免註冊
- 造訪後可離線使用
模式
不包含瀏覽器預設樣式與其他樣式表。內容不會傳送到任何地方。
| 選擇器 | 特異性 | 權重 | 情境 |
|---|
| 規則 | 值 | 特異性 | 層 | 結果 |
|---|
如何判斷哪條 CSS 規則會生效
- 選擇模式：計算選擇器，或找出生效的規則。
- 貼上選擇器，或貼上 CSS、HTML 與屬性。
- 查看分數，或生效的規則，以及其他規則落敗的原因。
常見問題
特異性如何計算？
每個 id 計為 1,0,0，每個類別、屬性或偽類計為 0,1,0，每個元素名稱或偽元素計為 0,0,1。通用選擇器與 :where() 不計分。
:is()、:not() 和 :has() 如何計算？
它們以其中特異性最高的引數計算。因此 :is(#a, .b) p 的分數為 1,0,1，因為 :is() 內的 #a 是最強的部分。規則 :where(#a) p 的分數則為 0,0,1。
為什麼位於層中的規則會輸給一般規則？
對於一般宣告，不在任何層中的規則會勝過層中的規則。但對於 !important，順序會反轉，因此較早的層會勝出。一般的 style 屬性會勝過所有一般樣式表規則，而 !important 的 style 屬性會勝過其他所有 !important 規則。
我的 CSS 會被傳送到任何地方嗎？
不會。您的瀏覽器會在這個分頁中解析並比對選擇器，不會將任何內容傳送到伺服器。
評價
還沒有評價，搶先評價吧。