CSS is() 与 where() 选择器：简化匹配与权重治理

概述`:is()` 将多种选择器合并为一个，使用最高权重参与级联；`:where()` 行为类似但不增加权重（特性为零），适合在架构中用于包裹前缀与容器类以避免权重膨胀。用法/示例/* :is 合并多选择器 */ .menu :is(a, button, [role="link"]) { color: #111 } /* :where 不增加权重，用于容器作用域 */ :where(.card) :is(.title, h2) { font-weight: 600 } /* 结合状态 */ .list :is(li:hover, li:focus-visible) { background: #f3f4f6 } 工程建议用 `:where()` 包裹组件根或容器类，控制权重并减少 `!important` 的需求。将复杂匹配合并到 `:is()`，避免重复选择器；保留清晰的作用域与层次。在旧浏览器提供降级选择器或通过构建时转译处理。参考与验证MDN：`:is()` — https://developer.mozilla.org/docs/Web/CSS/:isMDN：`:where()` — https://developer.mozilla.org/docs/Web/CSS/:whereSelectors Level 4 — https://www.w3.org/TR/selectors-4/