是否有一个CSS父选择器？ [英] Is there a CSS parent selector?

问题描述

如何选择作为锚元素直接父对象的< li> 元素？

How do I select the <li> element that is a direct parent of the anchor element?

例如我的CSS将是这样的：

In example my CSS would be something like this:

li < a.active {
    property: value;
}

显然有一些方法可以用JavaScript做，是存在于CSS第2级的某种解决方法。

Obviously there are ways of doing this with JavaScript but I'm hoping that there is some sort of workaround that exists native to CSS Level 2.

我想尝试的菜单被CMS排出，所以我不能移动active元素添加到< li> 元素...（除非我主题菜单创建模块，我不想这样做）。

The menu that I am trying to style is being spewed out by a CMS so I can't move the active element to the <li> element... (unless I theme the menu creation module which I'd rather not do).

任何想法？

推荐答案

目前没有办法在CSS中选择元素的父元素。

There is currently no way to select the parent of an element in CSS.

如果有办法，它将在当前CSS选择器规范中：

If there was a way to do it, it would be in either of the current CSS selectors specs:

• 选择器第3级规格


• CSS 2.1选择器规格

• Selectors Level 3 Spec
• CSS 2.1 Selectors Spec

同时，如果您需要选择父元素，则必须使用JavaScript。

In the meantime, you'll have to resort to JavaScript if you need to select a parent element.

选择器级别4工作草案包括与：has（）伪类。 com / has-selector /rel =nofollow noreferrer> jQuery实现。自2017年2月起， 任何浏览器仍不支持 。

The Selectors Level 4 Working Draft includes a :has() pseudo-class that works the same as the jQuery implementation. As of February 2017, this is still not supported by any browser.

使用：has（）原来的问题可以用这个解决：

Using :has() the original question could be solved with this:

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

这篇关于是否有一个CSS父选择器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！