在CSS属性select器中，“我”是什么意思？
我在Google Chrome用户代理样式表中find以下CSSselect器：
[type="checkbox" i] i是什么意思？
正如评论中所提到的，它是用于不区分大小写的属性匹配。 这是CSSselect器级别4的新function。
目前，它可用于Chrome 49 +，Firefox 47+，Safari 9+和Opera 37 + *。 在此之前，它只能在Chrome 39用户代理样式中使用，但可以通过设置实验function标志启用Web内容。
Opera的早期版本也可能支持它。
工作示例/浏览器testing：
[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>
这是select器4中引入的属性select器不区分大小写的标志。 显然，他们早在2014年8月就将这个function的实现隐藏到了Chrome中。
简而言之：该标志告诉浏览器不区分大小写地匹配type属性的值。 HTML中的属性值的默认select器匹配行为是区分大小写的 ，这通常是不希望的，因为许多属性被定义为不区分大小写的值，并且您要确保您的select器在所有情况下都会选取所有正确的元素。 type是这样一个属性的一个例子，因为它是一个枚举属性 ， 枚举属性被认为是不区分大小写的值 。
这里是相关的提交：
- 179370 – 执行
- 179401 – 更改到UA样式表，如问题的屏幕截图所示
请注意，它目前隐藏在“启用实验性Web平台function”标志中，您可以在chrome：// flags /＃enable-experimental-web-platform-features中访问该标志。 这也许可以解释为什么这个function在很大程度上被忽视了 – 隐藏在该标志后面的function只能在内部使用，而不能在公共代码中使用（例如作者样式表），除非启用，因为它们是实验性的，因此不能用于生产。
以下是您可以使用的testing用例 – 比较标志启用和禁用时的结果：
span[data-foo="bar"] { color: red; } span[data-foo="bar" i] { color: green; }
<span data-foo="bar">If all of this text is green,</span> <span data-foo="Bar">your browser supports case-insensitive attribute selectors.</span>
