CSS中是否存在父級選擇器？

Question

如何選擇作為錨點元素的直接父級的

元素？

例如，我的CSS可能是這樣的：

li < a.active {
    property: value;
}

顯然，可以使用JavaScript來實現這個目標，但我希望有一個原生於CSS Level 2的解決方法。

我正在嘗試樣式化的選單是由CMS產生的，所以我不能將活動元素移到

元素中...（除非我主題化選單創建模組，但我寧願不這樣做）。

Answer 1

您可以使用:has() CSS 偽類別

但是它在瀏覽器支援方面有限（目前尚不支援 Firefox）。

Answer 2

目前在CSS中沒有一種方式可以選擇一個元素的父元素，以便在所有瀏覽器中都能正常運作。

Selectors Level 4 Working Draft中包含了一個:has()偽類，它將提供這種功能。它將類似於jQuery的實作，但目前Firefox不支援。

li:has(> a.active) { /* 应用于li标签的样式 */ }

目前只有Firefox不預設支援該功能。

同時，如果您需要選擇一個具有完整跨瀏覽器支援的父元素，您將不得不在Firefox中使用JavaScript。