HTML要素 ・ 見出し・文章
<h3>
第3階層の見出し
h2 の章をさらに分けた「節」の見出しです。長い章の内容を整理するときに使います。
01
サンプルコード
HTML
1<h2>メニュー</h2>
2<h3>ドリンク</h3>
3<p>コーヒー、紅茶、季節のソーダ。</p>
4<h3>スイーツ</h3>
5<p>チーズケーキ、タルト。</p>
02
実行結果
ブラウザでの表示
03
解説
h3 は h2 の下位にあたる見出しです。章（h2）の中をいくつかの節に分けるときに使います。
見出しの数字は「重要度の順番」を表します。h2 の次は h3、その次は h4 と、1段ずつ下げていきます。
スクリーンリーダーの利用者は見出しの一覧からページ内を移動します。正しい階層にしておくと、内容を把握しやすくなります。
04
応用例・注意点
主な属性
| 属性 | 説明 |
|---|---|
id | ページ内リンクの移動先にする |
class | CSSで装飾するための名前 |
目次からページ内リンクする
見出しに id を付けると、a 要素からその位置へジャンプできます。
HTML
1<a href="#drink">ドリンク</a>
2
3<h3 id="drink">ドリンク</h3>
注意点
- 01h2 がないところで h3 を使わないようにします。
- 02見出しを太字や大きい文字の代わりに使わないでください。