class属性とは

class属性は、要素に分類名(種類)を指定する属性です。主にCSSでデザインを行なう際などに使用します。属性値は任意の文字列を指定します。なお、使用できる文字は、半角英数字とハイフン(-)、アンダーバー(_)です。ただし先頭の文字は、数字から始めてはいけません。また、半角スペースで区切る事で複数のclass名を指定することが可能です。

属性値
任意の文字列
(使用できる文字:半角英数字とハイフン(-)、アンダーバー(_))
利用できるバージョン(HTML4.01以降)
全てのバージョン
HTML5より前のバージョンで指定できる要素
<base>、<basefont>、<head>、<html>、<meta>、<param>、<script>、<style>、<title> 以外の要素
対応ブラウザ
  • Chrome
  • Firefox
  • Internet Explorer
  • Opera
  • Safari

class属性を使ったサンプル

基本的なclass属性の使用例

基本的なclass属性の例
<p class="fruits">
  りんご
</p>
.fruits {
  font-size: 1.2em;
}
ブラウザでの表示例

RERUN

class属性の複数使った例

class属性を複数使った例
<p class="fruits red">
  りんご
</p>
.fruits {
  font-size: 1.2em;
}

.red {
  color: #c00;
}
ブラウザでの表示例

RERUN

仕様

HTML5.1
3.2.5.7. The class attribute
HTML5
3.2.5.7 The class attribute
HTML4.01
7.5.2 Element identifiers: the id and class attributes

関連する属性

関連するレッスン