HTML <h1>から<h6>タグ
例
6つの異なるHTML見出し：
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
<h1>to<h6>タグは、HTMLの見出しを定義するために使用されます。
<h1>最も重要な見出しを定義します。<h6>最も重要度の低い見出しを定義します。
注：ページごとに1つだけ使用<h1>
してください。これは、ページ全体の主要な見出し/件名を表す必要があります。また、見出しレベルをスキップしないでください-で始まり<h1>、次に<h2>、などを使用します。
ブラウザのサポート
| Element | |||||
|---|---|---|---|---|---|
| <h1> - <h6> | Yes | Yes | Yes | Yes | Yes |
グローバル属性
<h1>to<h6>タグは、HTMLのグローバル属性もサポートします。
イベント属性
<h1>to<h6>タグは、HTMLのイベント属性もサポートします。
その他の例
例
見出しの背景色とテキストの色を設定します（CSSを使用）。
<h1 style="background-color:DodgerBlue;">Hello World</h1>
<h2 style="color:Tomato;">Hello
World</h2>
例
見出しの配置を（CSSを使用して）設定します。
<h1 style="text-align:center">This is heading 1</h1>
<h2 style="text-align:left">This
is heading 2</h2>
<h3 style="text-align:right">This is heading 3</h3>
<h4 style="text-align:justify">This is heading 4</h4>
関連ページ
HTMLチュートリアル：HTML見出し
HTML DOMリファレンス：見出しオブジェクト
デフォルトのCSS設定
ほとんどのブラウザは<h1>、次のデフォルト値で要素を表示します。
例
h1 {
display: block;
font-size: 2em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
ほとんどのブラウザは<h2>、次のデフォルト値で要素を表示します。
例
h2 {
display: block;
font-size: 1.5em;
margin-top: 0.83em;
margin-bottom: 0.83em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
ほとんどのブラウザは<h3>、次のデフォルト値で要素を表示します。
例
h3 {
display: block;
font-size: 1.17em;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
ほとんどのブラウザは<h4>、次のデフォルト値で要素を表示します。
例
h4 {
display: block;
font-size:
1em;
margin-top: 1.33em;
margin-bottom: 1.33em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
ほとんどのブラウザは<h5>、次のデフォルト値で要素を表示します。
例
h5 {
display: block;
font-size: .83em;
margin-top: 1.67em;
margin-bottom: 1.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
ほとんどのブラウザは<h6>、次のデフォルト値で要素を表示します。
例
h6 {
display: block;
font-size: .67em;
margin-top: 2.33em;
margin-bottom: 2.33em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}