見出し

このリファレンスの見方については「リファレンスの見方」をお読みください。

見出しを指定するタグは、 <h*>　</h*>　を使います。

*には、1から6までの数字が入ります。

【HTMLタグ】
<h1>見出し1</h1>
<h2>見出し2</h2>
<h3>見出し3</h3>
<h4>見出し4</h4>
<h5>見出し5</h5>
<h6>見出し6</h6>

それぞれ見出しの大きさは次のようになります。

スタイルシートを使えば見出しの文字色を変えたり、背景に色をつけたりすることができます。
見出しは「ブロック系要素」なので、背景色を変えると端まで全体に色がつきます。

スタイルシートは一度に複数の要素を指定できるので、文字色の指定と背景色の指定を一緒に記述してみます。

見出しの色を変える

【スタイルシートインライン】
<h1 style="color:#FFFFFF; background-color:#9999cc;">見出し見本</h1>

【スタイルシートヘッダ、外部ファイル】

h1 {
color: #FFFFFF;
background-color: #9999cc;
}

BODY部分は

<h1>見出し見本</h1>

今度は見出しの文字の開始部分をもう少し右に寄せてみましょう。

【スタイルシートインライン】
<h1 style="color:#FFFFFF; background-color:#9999cc; padding-left:30px;">見出し見本</h1>

【スタイルシートヘッダ、外部ファイル】

h1 {
color: #FFFFFF;
background-color: #9999cc;
padding-left:30px;
}

BODY部分は

<h1>見出し見本</h1>

「padding」というのは、内側の余白のことを示します。
上記の場合は、見出しの文字の左に30pxの余白を入れています。
数字には必ず単位（px）を付けてください。

「padding」とよく間違うのが「margin」です。
「padding」と「margin」の違いについては「リファレンス－余白」をご覧ください。