私はそれが内部で一つの例外を除いイテレータと同じ名前を持つ複数のクラスのCSSを使用することが可能ですかどうかを知りたいのです:どのように私は私のCSSを使用する必要があり、それが可能だ場合のCss
<div class="elem-1"></div>
<div class="elem-2"></div>
これらの2つのクラスを実装するには(2つ以上のことができます)?
私はそれが内部で一つの例外を除いイテレータと同じ名前を持つ複数のクラスのCSSを使用することが可能ですかどうかを知りたいのです:どのように私は私のCSSを使用する必要があり、それが可能だ場合のCss
<div class="elem-1"></div>
<div class="elem-2"></div>
これらの2つのクラスを実装するには(2つ以上のことができます)?
あなたは、CSSは次のように属性セレクタを使用することができます
[class^="elem-"], [class*=" elem-"] {
/* style properties */
}
しかし、私はむしろ、n番目の子のようなカウントセレクタを使用するかもしれないこの
<div class="elem specialStuffClass">...</div>
別のオプションのような2つのクラスを使用することをお勧めします。
一般に、HTMLでは複数のクラスを使用する必要があります。
<div class="shape shape-3-corners"></div>
<div class="shape shape-4-corners"></div>
両方のdivは、図形を表すdivのグループ内にあります。
特定のコーナー数を持つ図形を表す1つのdivのみがグループに含まれます。
また、pattern matching with attribute selectorsを見ることもできます。残念ながら、シンタックスはいくぶん限定されています。
[class*="elem-"]
あなたの特定の例では動作しますが、class="not-elem-3"
には誤認があります。
[class^="elem-"]
は、特定の例では機能しますが、class="another-class and elem-3"
には偽のネガティブを与えます。
あなたは可能性もgroupあなたのセレクタ:
.elem-1,
.elem-2 { }
...しかし、あなたはより多くを追加した場合、あなたはすべての番号を指定して、CSSを更新しなければなりません。もしあなたがたくさんいたなら、それはかなり扱いにくくなるでしょう。
[docs - cssセレクタ]への参照を追加することができます(http://stackoverflow.com/documentation/css/611/selectors/1987/attribute-selectors#t=20161110102728697694) –
@MoshFeu - W3C勧告はすでに答えている。 – Quentin
「イテレーターの内部」とはどういう意味ですか? –
div [クラス^ = "elem-"] – mamosek
@mamosekは右 –