发布途中发生了一件小事 的CSS :has() 选择器 到老年鉴。 我最初描述过 :has() 作为一个“宽容”的选择器，它的想法是它的参数中的任何东西都会被评估，即使一个或多个项目是无效的。
/* Example: Do not use! */
article:has(h2, ul, ::-scoobydoo) { }我们 ::scoobydoo 在那里？ 那是完全无效的。 宽容的选择器列表会忽略那个伪造的选择器，并继续评估其余项目，就好像它是这样写的：
article:has(h2, ul) { }
:has() 确实是一个宽容的选择器 在日期为 7 年 2022 月 XNUMX 日的先前草案中. 但这改变了 报告问题后 宽容的性质与 jQuery 冲突时 :has() 包含一个复杂的选择器（例如 header h2 + p). W3C 达成了一项决议，以 使 :has() 一个“无情”的选择器 就在几周前。
那么，我们之前的例子呢？ 整个选择器列表无效，因为伪造的选择器无效。 但是另外两个宽容的选择器， :is() 和 :where(), 保持不变。
有一些解决方法。 记住， :is() 和 :where()是宽容的，即使 :has() 不是。 这意味着我们可以将这些选择器中的任何一个嵌套在 :has() 获得更宽容的行为：
article:has(:where(h2, ul, ::-scoobydoo)) { }您使用哪一个可能很重要，因为 :is() 由其列表中最具体的项目决定。 所以，如果你需要一些不太具体的东西，你最好伸手去拿 :where() 因为它不会增加特异性分数。
/* Specificity: (0,0,1) */
article:has(:where(h2, ul, ::-scoobydoo)) { } /* Specificity: (0,0,2) */
article:has(:is(h2, ul, ::-scoobydoo)) { }我们更新了一些帖子以反映最新信息。 我在野外看到很多其他需要更新的东西，所以对于任何需要做同样事情的人来说，只需一点 PSA。
- SEO 支持的内容和 PR 分发。 今天得到放大。
- 柏拉图区块链。 Web3 元宇宙智能。 知识放大。 访问这里。
- Sumber: https://css-tricks.com/has-is-an-unforgiving-selector/
