如何选择作为锚元素的直接父元素的<li>元素？
例如，我的CSS应该是这样的：
li < a.active {
property: value;
}
很显然，JavaScript有很多方法可以做到这一点，但我希望有某种变通方法可以在CSS Level 2中使用。
我正在尝试设置样式的菜单被CMS弹出，因此我无法将活动元素移动到<li>元素。。。（除非我对菜单创建模块进行主题化，否则我不想这样做）。
当前回答
这是对一个类似（但我感觉不是完全相同）问题的回答，该问题已被关闭，支持这个问题，所以我在这里回答了如何在检查输入时更改边框颜色。
由于不可能使用纯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具有更强大的选择器，但并不是在所有浏览器中都一致实现。即使有了改进的选择器，我也不相信它能完全实现您在示例中指定的功能。
如果子代具有焦点，则内的伪元素：focus允许选择父代。
如果元素具有tabindex属性，则可以聚焦该元素。
浏览器支持
标签索引
实例
.parent:焦点在{背景：hsl（199deg，65%，73%）；}/*演示样式*/正文{边距：0；}.父级{背景：hsl（0，0%，80%）；最小高度：100vh；显示：栅格；放置内容：中心；}.儿童{背景：hsl（0，0%，0%）；颜色：白色；填充：3rem；大纲：0；光标：指针；字体：18px/1.25无衬线；宽度：20ch；}<div class=“parent”><div class=“child”tabindex=“1”>点击或关注我，我的父母会改变。</div></div>
从技术上讲，没有直接的方法可以做到这一点。但是，您可以使用jQuery或JavaScript进行排序。
然而，你也可以这样做。
a.active h1 {color: blue;}
a.active p {color: green;}
jQuery
$("a.active").parents('li').css("property", "value");
如果您想使用jQuery实现这一点，这里是jQuery父选择器的引用。
没有css（因此在css预处理器中）父选择器，因为“css工作组先前拒绝父选择器建议的主要原因与浏览器性能和增量渲染问题有关。”
