特定の文字列で始まるクラス名を持つすべての要素に一致します [重複] 質問する

特定の文字列で始まるクラス名を持つすべての要素に一致します [重複] 質問する

CSS3 で特定の文字列で始まるクラス名を持つ要素に「ワイルドカード」を使用することは可能ですか?

例:

<div class="myclass-one"></div>
<div class="myclass-two"></div>
<div class="myclass-three"></div>

そして、魔法のように上記のすべてをdiv一度に赤に設定します。

.myclass* { color: #f00; }

ベストアンサー1

次のようにすればうまくいくはずです:

div[class^='myclass'], div[class*=' myclass']{
    color: #F00;
}

編集: *Davidの提案に従ってワイルドカード( )を追加しました

おすすめ記事