<tagName class=class> - クラスの適用
要素に、スタイルシートで定義したクラス名を適用します。クラス名は半角スペースで区切って複数指定することができます。スタイルシートに関しては「とほほのスタイルシート入門」を参照してください。
クラス名に使用可能な文字は、HTML 4.0/4.01 では 半角英数字([a-zA-Z0-9])、ハイフン(-)、アンダースコア(_)、コロン(:)、ピリオド(.) で、先頭の1文字は半角英字([a-zA-z]) とするとされていましたが、HTML5 や HTML Living Standard では半角スペースを除く任意の文字を使用できることになりました。
id 属性とclass 属性の違いについてですが、id 属性は要素に一意の識別子を割り当てるものであるのに対して、class は、スタイルシートなどで定義したクラスに要素を関係つけるものです。文書内に、同じ ID を持つ複数の要素は存在しないのが普通ですが、同じクラスに関係づけられた複数の要素は存在します。
○ <div class="c1">...</div> ○ <div class="c1">...</div> // 複数の要素に同じ class 名をつけるのは OK ○ <div class="c1 c2">...</div> // ひとつの要素に複数の class 名をつけるのも OK ○ <div id="id1">...</div> × <div id="id1">...</div> // 複数の要素に同じ id をつけるのは NG × <div id="id1 id2">...</div> // ひとつの要素に複数の id をつけるのは NG
<html>
<head>
<title>テスト</title>
<style>
.title { color:red }
</style>
</head>
<body>
<h1 class="title">あいうえお</h1>
</body>
</html>