如何选择作为锚元素的直接父元素的<li>元素？
例如，我的CSS应该是这样的：
li < a.active {
property: value;
}
很显然，JavaScript有很多方法可以做到这一点，但我希望有某种变通方法可以在CSS Level 2中使用。
我正在尝试设置样式的菜单被CMS弹出，因此我无法将活动元素移动到<li>元素。。。（除非我对菜单创建模块进行主题化，否则我不想这样做）。
当前回答
没有css（因此在css预处理器中）父选择器，因为“css工作组先前拒绝父选择器建议的主要原因与浏览器性能和增量渲染问题有关。”
其他回答
据我所知，CSS 2中没有。CSS 3具有更强大的选择器，但并不是在所有浏览器中都一致实现。即使有了改进的选择器，我也不相信它能完全实现您在示例中指定的功能。
Selectors Level 4 Working Draft包含一个：has（）伪类，将提供此功能。它将类似于jQuery实现，但目前Firefox不支持。
li:has(> a.active) { /* styles to apply to the li tag */ }
截至2022年，Firefox是唯一默认不支持它的浏览器。
同时，如果需要选择完全支持跨浏览器的父元素，则必须在Firefox中使用JavaScript。
CSS选择器“General Sibling Combinator”可能用于您想要的用途：
E ~ F {
property: value;
}
这匹配前面有E元素的任何F元素。
目前还没有父选择器&它甚至没有在W3C的任何讨论中讨论。您需要了解浏览器如何评估CSS，才能真正了解我们是否需要它。
这里有很多技术解释。
Jonathan Snook解释了如何评估CSS。
Chris Coyier谈家长选择。
Harry Roberts再次谈到了如何编写高效的CSS选择器。
但妮可·沙利文对积极趋势有一些有趣的事实。
这些人都是前端开发领域的顶级人物。
更新2022 CSS选择器4
在CSS Selectors 4规范中，CSS引入了一个名为：has（）的新选择器，它最终允许我们选择父级。这意味着我们将能够针对一个包含特定子元素的CSS元素。这在Safari和Chrome105中都已得到支持。显示完整的支撑台在这里
父选择器工作
在CSS中，如果我们想选择一些东西，我们使用DOM下面的选择器。
例如，在div标记中选择p标记如下所示：
div p {
color: red;
}
不过，到目前为止，我们还无法真正选择其中包含p标记的div标记，这意味着我们不得不求助于Javascript。没有在CSS中实现这一点的主要原因是，这是一个相当昂贵的操作。CSS解析速度相对较快，但选择父标记需要相对较大的处理量。
使用：has选择器，我们现在可以选择具有p子级的div元素，或选择器的任何正常组合。
例如，选择带有子p的div现在看起来像这样：
div:has(p) {
color: red;
}
这将使任何带有子p的div变为红色。
将父选择与其他选择器组合
就像任何其他CSS选择器一样，我们可以针对特定情况组合这些选择器。例如，如果只选择具有直接span子级的div标记：
div:has(> span) {
color: red;
}
正如：的词汇所暗示的，它不仅仅局限于父母的选择。
例如，下面我们可以选择一个span，该span：有一个同级div：
span:has(+ div) {
color: red;
}
甚至，通过使用：not（）选择器选择一个没有子元素的元素。
例如，下面将选择任何没有p子级的div：
div:not(:has(p)) {
color: red;
}
选择仅包含CSS中文本的元素
CSS中一个非常常见的问题是：empty标记不选择包含任何文本的元素，因此有时元素可以包含一个空格，而：empty将不适用。has选择器使我们能够选择只包含文本节点而不包含其他子元素的元素。
虽然这并不是简单的空元素和空格的完美解决方案（因为这将选择任何只包含文本的元素，而不包含额外的HTML DOM元素），但它确实让我们能够选择只包含文本节点的DOM元素，这在以前是不可能的。我们可以通过以下代码实现这一点：
div:not(:has(*)) {
background: green;
}
