搜索

首页  >  问答  >  正文

CSS中是否有父选择器?

<p>如何选择作为锚点元素的直接父级的<code><li></code>元素?</p> <p>举个例子,我的CSS可能是这样的:</p> <pre class="brush:php;toolbar:false;">li < a.active { 属性: 值; }</pre> <p>显然,可以使用JavaScript来实现这个目标,但我希望有一种CSS Level 2原生的解决方法。</p> <p>我正在尝试样式化的菜单是由CMS生成的,所以我不能将活动元素移动到<code><li></code>元素中...(除非我主题化菜单创建模块,但我不想这样做)。</p>
P粉270842688P粉270842688461 天前466

全部回复(2)我来回复

  • P粉404539732

    P粉4045397322023-08-22 09:40:21

    您可以使用:has() CSS 伪类

    但是它的浏览器支持有限(目前Firefox不支持)。

    回复
    0
  • P粉794851975

    P粉7948519752023-08-22 00:17:37

    目前在CSS中没有一种方式可以在所有浏览器中选择元素的父级。

    Selectors Level 4 Working Draft包括一个:has()伪类,它将提供这种能力。它将类似于jQuery的实现,但目前Firefox不支持。

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

    Firefox是唯一一个目前默认不支持它的主要浏览器

    在此期间,如果您需要选择具有完全跨浏览器支持的父元素,您将不得不在Firefox中使用JavaScript。

    回复
    0
  • 取消回复