css - 是否有 CSS 父级选择器?

标签 css css-selectors

如何选择 <li> anchor 元素的直接父元素?

例如,我的 CSS 是这样的:

li < a.active {
    property: value;
}

显然有一些方法可以用 JavaScript 做到这一点,但我希望有某种 CSS Level 2 原生的解决方法。

我尝试设置样式的菜单被 CMS 弹出,所以我无法将事件元素移动到 <li>元素...(除非我将我不想做的菜单创建模块作为主题)。

最佳答案

目前无法以适用于所有浏览器的方式在 CSS 中选择元素的父元素。

Selectors Level 4 Working Draft包括将提供此功能的 :has() 伪类。它将类似于 jQuery implementation , 但目前不受 Firefox 支持。

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

Firefox is the only major browser not currently supporting it by default .

与此同时,如果您需要选择具有完全跨浏览器支持的父元素,您将不得不求助于 Firefox 中的 JavaScript。

关于css - 是否有 CSS 父级选择器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30029732/

相关文章:

css - 如何为输入框内的内容编写合适的选择器?

css - 只选择第一个元素,不考虑类型

html - 如何在 sm 显示器上跨越 2 行的 bootstrap 4 表单行中的字段之间留出边距?

javascript - 显示下拉菜单以选择 iframe 中的内容

html - 使用 CSS 居中 DIV

css - 最小高度和最小宽度不能很好地工作

html - 并排对齐2个div

webdriver - cssSelector 中 contains 的替代方法? Selenium 网络驱动程序

html - 另一个类中类前缀的选择器

css - 没有大小的元素使用位置 : absolute, 在上面动态插入 block - 正确的行为是什么?