CSS 可以根據子元素選擇元素嗎？

具有特定子元素的元素的CSS 選擇器

問題： 是否可以建立一個CSS 選擇器選擇具有特定子元素的所有元素？例如，選擇所有

包含 的元素元素？

答案：

不幸的是，CSS2 和 CSS3 選擇器規範不允許父級選擇。這意味著不可能基於本機子元素來選擇元素。

最新進展：

但是，CSS 選擇器規格最近發生了變化。雖然早期的「選擇器等級 4 工作草案」包含用於選擇應接收樣式的元素的「主題」功能，但該功能在後續草案中被刪除。

關係偽類： :has( )

最近的「Selectors Level 4 Editor's Draft」包括「:has()」關係偽類，它允許作者根據元素的內容選擇元素。這提供了與 jQuery 自訂“:has()”偽選擇器的兼容性。

使用“:has()”，上述範例可以寫為：

p:has(span) {
    color: red;
}

這個選擇器會選擇全部

包含 的元素元素並用紅色設計它們。需要注意的是，該解決方案可能不會在所有瀏覽器上統一支援。

以上是CSS 可以根據子元素選擇元素嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！