Google Chromeユーザーエージェントスタイルシートで次のCSSセレクターを見つけました。

[type="checkbox" i]

どういうi意味ですか？

コメントで述べたように、大文字と小文字を区別しない属性の照合用です。これは、CSSセレクターレベル4の新機能です。

現在、Chrome 49以降、Firefox 47以降、Safari 9以降、Opera 37以降*で利用できます。これより前は、Chrome 39前後のChromeユーザーエージェントスタイルでのみ利用可能でしたが、試験的機能フラグを設定することで、Webコンテンツに対して有効にすることができました。

*以前のバージョンのOperaでもサポートされている可能性があります。

動作例/ブラウザテスト：

[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>

上記の正方形は、ブラウザがこの機能をサポートしている場合は緑色になり、サポートしていない場合は赤色になります。

これは、セレクタ4で導入された属性セレクタの大文字と小文字を区別しないフラグです。どうやら彼らはこの機能の実装を早ければ2014年8月にChromeに組み込んだようです。

簡単に言うと、このフラグは、type大文字と小文字を区別せずに属性のそれぞれの値を照合するようにブラウザに指示します。HTML内の属性値のデフォルトのセレクタマッチング動作は、大文字と小文字を区別し、多くの属性は、大文字と小文字を区別しない値を持つように定義されているため、多くの場合、望ましくない、とあなたは関係なく、例のすべての権利の要素まで必ずご選択ピックを作りたいです。typeは列挙型属性であり、列挙型属性は大文字と小文字を区別しない値を持つと言われているため、このような属性の一例です。

関連するコミットは次のとおりです。

• 179370 —実装
• 179401 —質問のスクリーンショットに示されているUAスタイルシートの変更

現在、「試験運用版のWebプラットフォーム機能を有効にする」フラグ内で非表示になっていることに注意してください。このフラグには、chrome：// flags /＃enable-experimental-web-platform-featuresからアクセスできます。これは、機能がほとんど気付かれない理由を説明している可能性があります。このフラグの背後に隠されている機能は、有効である場合を除き、内部でのみ使用でき、公開されているコード（作成者のスタイルシートなど）では使用できません。

使用できるテストケースは次のとおりです。フラグが有効な場合と無効な場合の結果を比較します。

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>

typeほぼすべての属性で使用できることを示すのではなく、カスタムデータ属性を使用していることに注意してください。

これを書いている時点では他の実装については知りませんが、他のブラウザがすぐに追いつくことを期待しています。これは比較的シンプルですが、標準に非常に役立つ追加であり、将来使用できることを楽しみにしています。