CSS 屬性選擇器中「i」標誌的用途是什麼？

CSS 屬性選擇器中的「i」有什麼作用？

在CSS 中，你可能會遇到帶有附加“i”的屬性選擇器，如下所示來自Google Chrome 用戶代理樣式表的示例：

[type="checkbox" i]

這個“ i」指定不區分大小寫的屬性匹配，這是CSS 中引入的一項創新選擇器等級4。

瀏覽器相容性

雖然Chrome (49 )、Firefox (47 )、Safari (9 ) 和Opera (37 ) 等流行瀏覽器目前支援此功能，它最初僅在Chrome 39 左右的Chrome 用戶代理樣式中可用。 Web 開發人員可以透過設定實驗性功能來為 Web 內容啟用它標誌。

範例

這裡有一個測試瀏覽器支援的快速示範：

<!-- Color will be green on supported browsers, red on unsupported -->

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

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

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

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

以上是CSS 屬性選擇器中「i」標誌的用途是什麼？的詳細內容。更多資訊請關注PHP中文網其他相關文章！