'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中文网其他相关文章！