<p>如何选择作为锚点元素的直接父级的<code><li></code>元素？</p>
<p>举个例子，我的CSS可能是这样的：</p>
<pre class="brush:php;toolbar:false;">li < a.active {
属性: 值;
}</pre>
<p>显然，可以使用JavaScript来实现这个目标，但我希望有一种CSS Level 2原生的解决方法。</p>
<p>我正在尝试样式化的菜单是由CMS生成的，所以我不能将活动元素移动到<code><li></code>元素中...（除非我主题化菜单创建模块，但我不想这样做）。</p>
2
877
![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
您可以使用
:has()CSS 伪类但是它的浏览器支持有限（目前Firefox不支持）。
目前在CSS中没有一种方式可以在所有浏览器中选择元素的父级。
Selectors Level 4 Working Draft包括一个
:has()伪类，它将提供这种能力。它将类似于jQuery的实现，但目前Firefox不支持。li:has(> a.active) { /* styles to apply to the li tag */ }Firefox是唯一一个目前默认不支持它的主要浏览器。
在此期间，如果您需要选择具有完全跨浏览器支持的父元素，您将不得不在Firefox中使用JavaScript。