有 CSS 父選擇器嗎？

Question

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

元素？

舉個例子，我的 CSS 應該是這樣的：

li < a.active {
    property: value;
}

顯然，有多種方法可以使用 JavaScript 實現此目的，但我希望 CSS Level 2 本身有某種解決方法。

我嘗試設定樣式的選單是由CMS 噴出的，因此我無法將活動元素移到

元素. ..（除非我對選單進行主題化）創建模組，我不想這樣做）。

Answer 1

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

#但它的瀏覽器支援有限（目前 Firefox 不支援）。

Answer 2

目前無法以適用於所有瀏覽器的方式選擇 CSS 中元素的父元素。

選擇器等級 4 工作草案 包含 :has() 偽類別將提供此功能。它將類似於 jQuery 實作，但目前 Firefox 不支援。

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

Firefox 是目前唯一預設不支援它的主流瀏覽器。

同時，如果您需要選擇具有完全跨瀏覽器支援的父元素，則必須在 Firefox 中求助於 JavaScript。