:is()取括号内最高权重子选择器的特异性（如:is(.btn, #header, [data-id])为1-0-0），:where()恒为0-0-0不参与层叠竞争，仅依赖外部选择器提供权重。
:is() 和 :where() 的优先级计算规则完全不同——前者取括号内最高 specificity 的选择器权重，后者恒为 0-0-0。
权重怎么算：:is() 取最大值，不是平均也不是相加
:is() 的权重完全取决于它内部**最重的那个子选择器**。比如 :is(.btn, #header, [data-id]) 整条规则的特异性就是 #header 的 1-0-0；而 :is(.a, .b, .c) 权重仍是 0-0-1，和单独写 .a 一样，毫无提权效果。
- 混用类型才有意义：
:is(button, [type="submit"], .submit-btn)权重由[type="submit"]（0-0-1）或button（0-0-1）决定，不会升到 ID 级 - 一旦塞进 ID 选择器，比如
:is(.foo, #bar)，整条规则立刻变成 1-0-0，可能意外覆盖第三方组件（如.ant-btn） -
:is()不支持伪元素：:is(.a::before)是非法语法，整条 CSS 规则会被浏览器静默丢弃
为什么 :where() 样式经常“不生效”
:where() 的权重永远是 0-0-0，哪怕你写 :where(#nav .item:hover)，整个伪类也不贡献任何特异性。它只靠外部选择器“借力”，比如 nav :where(a, button) 的权重只来自 nav（0-0-1）。
- 典型误用：
:where(.btn) { color: red; }—— 连一个普通div标签选择器都压不过，样式必然被覆盖 -
!important对它无效：权重为 0 的声明加!important，仍会被任何非零权重规则覆盖 - 不能写
:where(a:hover)：虽然语法合法，但旧 Safari（15.4 之前）可能直接忽略整条规则
兼容性与错误处理：一逗号就失效
这两个伪类对语法错误极其敏感。浏览器不会局部忽略错误部分，而是直接丢弃整条 CSS 规则，控制台往往只报模糊警告，排查困难。
立即学习“前端免费学习笔记（深入）”；
- 常见致命错误：
:is(.a, .b, )（末尾多余逗号）、:is(:hover)（单独伪类非法）、:is(.a + .b::before)（含伪元素） - Safari 15.4 之前不支持嵌套：
:is(:is(.a, .b))会静默失效，不是报错 - 降级不能靠 polyfill 自动兜底：PostCSS 插件（如
postcss-preset-env）对:where()往往直接剔除，而非模拟
真正容易被忽略的是：权重差异不是“风格偏好”，而是行为分水岭——:is() 是增强工具，:where() 是隔离工具；用错一个，轻则样式不生效，重则破坏整个组件层叠逻辑。
