class
class
グローバル属性 は、要素のクラスを空白区切りで並べたリストで、大文字小文字を区別します。クラスは CSS の クラスセレクター や JavaScript の DOM メソッド document.getElementsByClassName
といった関数により、特定の要素を選択したり特定の要素にアクセスしたりすることを可能にします。
試してみましょう
<p>Narrator: This is the beginning of the play.</p>
<p class="note editorial">Above point sounds a bit obvious. Remove/rewrite?</p>
<p>Narrator: I must warn you now folks that this beginning is very exciting.</p>
<p class="note">[Lights go up and wind blows; Caspian enters stage right]</p>
.note {
font-style: italic;
font-weight: bold;
}
.editorial {
background: rgb(255, 0, 0, 0.25);
padding: 10px;
}
.editorial:before {
content: "Editor: ";
}
仕様書ではクラス名の要件を示していませんが、ウェブ開発者は要素の外見ではなく、意味論的な目的を表す名前を使用することが推奨されます。例えば、あるクラスの要素が イタリック体 で表示されるとしても、クラス名は attribute の方が italics よりも属性を説明します。意味論的な名前は、ページの外見を変更した場合でも論理的であり続けます。
仕様書
Specification |
---|
HTML # global-attributes:classes-2 |