15

img[class*="align"]CSSでの意味は?

私はこれを多くのスタイルシートで見てきましたが、なぜそれが使用され、何をするのかはわかりません。何か案が?

4

2 に答える 2

19

これは、「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 の例を次に示します。

于 2013-06-14T09:50:39.130 に答える
8

を含むimgクラスを持つすべての要素に一致します。 align

仕様には、これに関する詳細情報があります。

CSS セレクターの W3 仕様

于 2013-06-14T09:50:14.503 に答える