2つのCSSセレクタの違いは何ですか？[クラス^ =テスト] vs [クラス| =テスト]

Question

これらの2つの[class^=test]と[class|=test]は、

本当に違いがあるのでしょうか。

Answer 1

[class^="test"] 

上記クラス「テスト」とを開始、それは試験が第二クラスであれば見つけるために失敗するすべての要素を選択します。

しかし：クラスに一致する要素を見つける

[class|="test"] 

は、クラスが を「テスト」されている場合は表示されませんが、クラスは、上記のいずれかが一致し、「テスト」されている場合わかりますどちらも。また、テストが第2クラスかどうかを見つけることができません。

[class|="test-"] 

この場合にのみ、「試験 - 」を受け入れると、「テストINGの」または「試験 - 」、例えば、「テストINGの」で始まる文字列を受け入れないであろう。