\'i\' 标志如何在 CSS 中启用不区分大小写的属性匹配？

理解 CSS 属性选择器中“i”的含义

在现代 Web 开发中，CSS 属性选择器在样式元素中起着至关重要的作用根据他们的属性。其中一个属性是“i”，这可能会引发对其重要性的疑问。

解释 CSS 选择器 [type="checkbox" i]

您拥有的代码片段提供的 [type="checkbox" i] 举例说明了 CSS 选择器级别 4 中新引入的功能：不区分大小写的属性匹配。无论大小写差异，此功能都可以匹配属性。

可用性和支持

目前，此功能在主要浏览器版本中得到了广泛支持：

• Chrome 49
• Firefox 47
• Safari 9
• Opera 37

但是，自版本 39 以来，它已在 Chrome 的用户代理样式中可用，但需要启用实验性功能才能在网络内容上使用.

浏览器示例测试

要测试此功能在不同浏览器中的支持，您可以使用以下 HTML/CSS 片段：

<br>[data-test] {<pre class="brush:php;toolbar:false">width: 100px;
height: 100px;
margin: 4px;

}

[data-test="A"] {

background: red;

}

[data-test="a" i] {

background: green;

}

在支持的浏览器中，div 元素将为绿色，表示成功不区分大小写匹配。不然就红了。

以上是\'i\' 标志如何在 CSS 中启用不区分大小写的属性匹配？的详细内容。更多信息请关注PHP中文网其他相关文章！