搜尋

首頁  >  問答  >  主體

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粉270842688465 天前475

全部回覆(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
  • 取消回覆