img[class*="align"]
CSSでの意味は?
私はこれを多くのスタイルシートで見てきましたが、なぜそれが使用され、何をするのかはわかりません。何か案が?
img[class*="align"]
CSSでの意味は?
私はこれを多くのスタイルシートで見てきましたが、なぜそれが使用され、何をするのかはわかりません。何か案が?
これは、「align」を含む任意のタグ クラス テキストに一致する属性セレクターです。img
たとえば、次のいずれかに一致します。
<img class="dummy align test" />
<img class="test align-1" />
<img class="hello-align" />
<img class="abaligncd" />
<img class="align" />
ドキュメントから(上記のリンク):
E[foo*="bar"] - 「foo」属性値に部分文字列「bar」が含まれる E 要素
これは、一般的な CSS フレームワークで使用され、それぞれに新しい同一のクラスを追加することなく、複数の同様のクラスをスタイルします。たとえば、次のマークアップがあるとします。
<p class="central para-red">Hello, world!</p>
<p class="para-green bold">Hello, world!</p>
<p class="para-blue">Hello, world!</p>
<p>Hello, world!</p>
p
以下を使用するだけで、すべてのバリエーションを手動で入力することなく、クラスに「para-」が含まれるすべての要素にスタイルを適用できます。
p[class*="para-"] { ... }
これを使用したJSFiddle の例を次に示します。