mozilla

クラスセレクタ

概要

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 要素です。

仕様

仕様 状態 コメント
CSS Selectors Level 3 勧告  
CSS 2.1 勧告  
CSS 1 勧告  

ブラウザの互換性

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本的なサポート (有) (有) (有) (有) (有)
機能 Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本的なサポート ? ? ? ? ? ?

参照

  • --

ドキュメントのタグと貢献者

Contributors to this page: ethertank, sii
最終更新者: ethertank,
サイドバーを隠す