html - 为什么 has 属性在我的浏览器上不起作用？

Question

我正在开发一个大型 Java Web 应用程序，我想添加一个 css 属性，但它不起作用。

这是我的简单代码(HTML):

div:has(p) {
  background-color: red;
}

<div>
  <p>Prueba</p>
</div>

目标是 Prueba 的背景颜色为红色，但不起作用。你能帮我解决这个问题吗？我想用 p 引用 div 。

Answer 1

:has 是 CSS 4 级选择器，不会在 CSS 中实现，只能在 JS querySelector 和类似的东西中实现。

这种情况是因为 :has() 不是“动态配置文件”，与其他选择器不同。它不会在 CSS 中实现，因为“符合选择器级别 4 的实现必须使用动态配置文件”[ source ]