有 CSS 父選擇器嗎？
P粉176980522
2023-08-23 10:53:50
<p>如何選擇作為錨元素直接父級的 <code></code></p><li> 元素？ <p><br /></p>
<p>舉個例子，我的 CSS 應該是這樣的：</p>
<pre class="brush:php;toolbar:false;">li < a.active {
property: value;
}</pre>
<p>顯然，有多種方法可以使用 JavaScript 實現此目的，但我希望 CSS Level 2 本身有某種解決方法。 </p>
<p>我嘗試設定樣式的選單是由CMS 噴出的，因此我無法將活動元素移到<code></code></p></li><li> 元素. ..（除非我對選單進行主題化）創建模組，我不想這樣做）。 <p><br /></p></li>
您可以使用
:has()CSS 偽-類別#但它的瀏覽器支援有限（目前 Firefox 不支援）。
目前無法以適用於所有瀏覽器的方式選擇 CSS 中元素的父元素。
選擇器等級 4 工作草案 包含
:has()偽類別將提供此功能。它將類似於 jQuery 實作，但目前 Firefox 不支援。li:has(> a.active) { /* styles to apply to the li tag */ }Firefox 是目前唯一預設不支援它的主流瀏覽器。
同時，如果您需要選擇具有完全跨瀏覽器支援的父元素，則必須在 Firefox 中求助於 JavaScript。