如何选择作为锚元素的直接父元素的<li>元素？
例如，我的CSS应该是这样的：
li < a.active {
property: value;
}
很显然，JavaScript有很多方法可以做到这一点，但我希望有某种变通方法可以在CSS Level 2中使用。
我正在尝试设置样式的菜单被CMS弹出，因此我无法将活动元素移动到<li>元素。。。（除非我对菜单创建模块进行主题化，否则我不想这样做）。
当前回答
在CSS 2中没有办法做到这一点。您可以将类添加到li中并引用a:
li.active > a {
property: value;
}
其他回答
这是对一个类似（但我感觉不是完全相同）问题的回答，该问题已被关闭，支持这个问题，所以我在这里回答了如何在检查输入时更改边框颜色。
由于不可能使用纯CSS根据父级的状态来设置父级的样式，因此此代码段会更改HTML，以便在输入元素后面紧跟一个空span元素。此span元素不执行任何操作，直到输入悬停在其显示自身的位置，并展开以适应与已设置位置的祖先相同的大小。这是标签本身，而不是输入。因此，边框（阴影）看起来就像是在标签上。
* {边距：0；填充：0；框大小调整：边框框；}.外部字段{显示：柔性；}.list标签{填充：8px 5px；边框：2px实心黑色；宽度：32%；保证金：1%；显示：柔性；调整内容：间距；对齐项目：居中；柔性流：行；位置：相对；}输入[type=“radio”]~span{显示：无；}input[type=“radio”]：选中/span{显示：内联块；宽度：100%；高度：100%；边框：2px纯红色；方框阴影：0 0 0 3px橙色；位置：绝对；顶部：0；左：0；}<div class=“OuterField”><label for=“List1”class=“listLabel”>列表1<input type=“radio”id=“List1”name=“list”value=“List1“><span></span></label><label for=“List2”class=“listLabel”>列表2<input type=“radio”id=“List2”name=“list”value=“List2“><span></span></label></div>
Selectors Level 4 Working Draft包含一个：has（）伪类，将提供此功能。它将类似于jQuery实现，但目前Firefox不支持。
li:has(> a.active) { /* styles to apply to the li tag */ }
截至2022年，Firefox是唯一默认不支持它的浏览器。
同时，如果需要选择完全支持跨浏览器的父元素，则必须在Firefox中使用JavaScript。
据我所知，CSS 2中没有。CSS 3具有更强大的选择器，但并不是在所有浏览器中都一致实现。即使有了改进的选择器，我也不相信它能完全实现您在示例中指定的功能。
您可以尝试使用超链接作为父级，然后在悬停时更改内部元素。这样地：
a.active h1 {color:red;}
a.active:hover h1 {color:green;}
a.active h2 {color:blue;}
a.active:hover h1 {color:yellow;}
这样，您可以根据父元素的滚动来更改多个内部标记中的样式。
下面是一个使用悬停指针事件的黑客：
<!doctype html><html><head><title></title><style>/*附件*/.父级{宽度：200px；高度：200px；背景：灰色；}父母亲.选择器{显示：柔性；对齐内容：中心；对齐项目：居中；}.选择器{光标：指针；背景：银色；宽度：50%；高度：50%；}</style><style>/*相关的*/.父级{背景：灰色；指针事件：无；}.parent:悬停{背景：紫红色；}父母亲.选择器{指针事件：自动；}</style></head><body><div class=“parent”><div class=“selector”></div></div></body></html>
