Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】sub要素の使い方

sub要素の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

subオブジェクトは、テキストを下付き文字として表示するHTML要素を表すオブジェクトです。この要素は、主に化学式、数学式、著作権表示など、特定のテキストが通常のベースラインよりも少し下に配置され、かつ小さいフォントで表示されることに意味がある場合に使用されます。

例えば、水の化学式「H₂O」の「2」や、数学における変数「x₁」の「1」のように、文字が固有の役割を持つ場合に適用されます。sub要素を使用することで、単なる見た目の変更ではなく、そのテキストが下付き文字であるという構造的な意味をブラウザや検索エンジン、スクリーンリーダーなどのユーザーエージェントに正確に伝えることができます。

この意味的な付与は、コンテンツのアクセシビリティを向上させ、セマンティックなマークアップを促進します。視覚的にテキストを下付きにしたいだけで、意味的な区別がない場合は、このsub要素ではなく、CSSのスタイル指定(例:vertical-align: sub;)を用いることが推奨されます。sub要素は、上付き文字を表すsup要素と対になり、文書における特定の情報の表現に貢献します。

公式リファレンス: <sub>: The Subscript element

構文(syntax)

1<p>H<sub>2</sub>O</p>

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ