タイトルを入れる

まだboxだけの淋しいホームページにタイトルを入れてみましょう。

この様に<div id="banner">とbannerのboxの終了タグの</div>の間に コピーペーストして下さい。キーボードのEnterキーで<div id="banner">と</div>間を改行させると 見やすいですよ。１回ファイルを閉じてからもう１回開くとタイトルが表示されているはずです。

このままでは文字が左上に寄りすぎて見にくいのでスタイルシート（index.css）を使って、 文字を中央にしてみましょう。

これでタイトル文字が中央になりました。

■このページのタグ解説■

<h1>〜</h1>

文章の文字を大きくします。数字部分を小さくしていけば文字は逆に小さくなります。

text-align

指定したbox内（ここでは#banner）の文章の位置を変更する時に使います。left/right/centerがあります。

padding

指定したbox内（ここでは#banner）の内容の位置を細かく変更する時に使います。top/left/right/bottomがあります。 padding-top:20px;でboxの上側に20pxの余白を付けます。

paddingでbox内に余白を作ると、boxがずれて表示されてしまいます。そんなときはずらした分だけ、boxの大きさを 減らせばＯＫです。

*今回はtopを20pxずらしたので、heightをマイナス20pxすればOKです。