クラスセレクタ

概要

HTML 文書において、 CSS のクラスセレクタは、要素の class 属性に内容に基づいて要素をマッチします。 class 属性はスペースで区切られた項目リストとして定義され、それらの項目の 1 つが、セレクタで与えられたクラス名と正確にマッチしなければなりません。

構文

.classname { style properties }

これは、以下の属性セレクタに相当することに注意して下さい。

[class~=classname] { style properties }

例

span.classy {
  background-color: DodgerBlue;
}

これを、

  <span class="classy">テキストを伴った span 要素です。</span>
  <span>別な span 要素です。</span>

とすると、以下のように表示されるでしょう。

テキストを伴った span 要素です。

別な span 要素です。

仕様

ブラウザの互換性

参照

• --