CSS 选择器优先级

输入一个 CSS 选择器,工具会计算出它的优先级三元组 (a, b, c) 与数值总分;若填写第二个选择器,还会比较两者的优先级高低。适合排查样式覆盖问题时快速核对。全部在浏览器本地完成。

选择器输入 等待输入

可选择填写第二个选择器以比较优先级高低。

计算结果
ID 选择器—
类/属性/伪类—
元素/伪元素—
数值总分—
输入 CSS 选择器后点击计算,结果将显示在这里。

优先级按 (a,b,c) 三元组比较,a 为 ID 选择器数量;结果仅供参考。

计算说明
  • 优先级使用三元组 (a, b, c) 表示,比较时从 a 到 c 依次比较。
  • a:ID 选择器(#id)的数量。
  • b:类选择器、属性选择器与伪类的数量。
  • c:元素选择器与伪元素(::before)的数量。
  • 通配符 *、组合符与并列符不增加优先级。
  • 数值总分为 a×100 + b×10 + c,仅用于直观排序。