如何在 CSS 中選擇具有任何'data”屬性的元素？

基於通配符的屬性名稱 CSS 選擇器

使用 CSS 選擇器時，基於屬性定位元素至關重要。 「data-*」屬性提供了一種儲存元素自訂資料的便捷方法。但是，在某些情況下，您可能需要選擇具有任何「資料」屬性的元素，無論其特定名稱為何。

屬性名稱定位的目前狀態

目前，CSS 不提供屬性名稱通配符選擇器的本機支援。提案 [data-*] 是一個有趣的想法，但尚未實現。

現有選項

雖然通配符屬性名稱沒有直接的解決方案，但您可以使用以下CSS 選擇器：

[data]

此選擇器針對任何具有“data”屬性的元素，無論其屬性為何名稱。但是，這可能會導致意外選擇具有以“資料”開頭的其他屬性的元素。

建議的語法

來自 [email protected]的有前途的建議語法郵件列表是：

x-admin-* { ... }
[data-my-*] { ... }

此語法允許在屬性名稱的前綴內進行通配符匹配，從而實現更具體的

結論

目前，沒有直接的方法可以根據CSS 中的通配符屬性名稱來定位元素。然而，所提出的語法為未來的發展帶來了希望，將實現更通用、更有效率的基於屬性的選擇。

以上是如何在 CSS 中選擇具有任何'data”屬性的元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！