「i」標誌如何在 CSS 中啟用不區分大小寫的屬性匹配？

CSS 屬性選擇器中不區分大小寫的屬性與「i」相符

在 CSS屬性選擇器的上下文中，出現了一個問題關於代碼中字母“i”的重要性snippet:

[type="checkbox" i]

答案：

屬性值“ checkbox”後面附加的“i”表示不區分大小寫的屬性匹配。這是 CSS 選擇器 Level 4 中引入的一項功能，允許更靈活和包容性地匹配元素屬性。

瀏覽器支援：

目前支援此功能在：

• Chrome 49
• Firefox 47
• Safari 9
• Opera 37（以及可能更早的版本）

演示：

這是示例代碼來說明不區分大小寫的屬性的工作原理匹配：

[data-test] {
    width: 100px;
    height: 100px;
    margin: 4px;
}

[data-test="A"] {
    background: red;
}

[data-test="a" i] {
    background: green;
}

Green if supported, red if not:

<div data-test="A"></div>

如果您的瀏覽器支援不區分大小寫的屬性匹配，則範例元素將具有綠色背景。否則，它將具有紅色背景。

以上是「i」標誌如何在 CSS 中啟用不區分大小寫的屬性匹配？的詳細內容。更多資訊請關注PHP中文網其他相關文章！