css - 有 CSS 父选择器吗？

Question

如何选择 <li>元素是 anchor 元素的直接父元素？

举个例子，我的 CSS 应该是这样的:

li < a.active {
    property: value;
}

显然，有多种方法可以使用 JavaScript 实现此目的，但我希望 CSS Level 2 本身存在某种解决方法。

我尝试设置样式的菜单是由 CMS 吐出的，因此我无法将事件元素移动到 <li>元素...(除非我为菜单创建模块设置主题，但我不想这样做)。

Answer 1

目前无法以适用于所有浏览器的方式选择 CSS 中元素的父元素。

Selectors Level 4 Working Draft包含一个 :has() 伪类来提供此功能。它将类似于 jQuery implementation ，但目前 Firefox 不支持。

li:has(> a.active) { /* styles to apply to the li tag */ }

Firefox is the only major browser not currently supporting it by default .

与此同时，如果您需要选择具有完全跨浏览器支持的父元素，则必须在 Firefox 中求助于 JavaScript。