ページを書く

さて、前回の項ではHTMLのページの作り方を学びました。今回から本文を記述していきましょう。

ページタイトルを付ける

さて、ページに必要な要素は何でしょうか。それはページ名と本文です。いきなりですがここで問題です、ページ名はheadとbody、どちらに書けばいいでしょうか?


<html>
<head>
<title>タイトル</title>
</head>
<body>
本文
</body>
</html>

問題の答えです。タイトルはtitleタグを使って表します。そしてtitleタグはheadの中に書きます。ページ本文と違い、先に読み込みたい情報だからです。

本文の改行

さて、ページ名を付けたので次は本文の方をやっていきましょう。HTMLではソースでいくら改行しても、それはページに反映されません。改行するためにはbrタグを使う必要があります。ちなみに、brはbreak(≒改行)の英語の略です。

サンプルコード

<body>
1行目<br>
2行目<br>
3行目
</body>

実行結果

1行目
2行目
3行目

これで文字が3行表示されるコーディングができました。

水平線を引く

本項の最後に水平線(horizon)の引き方を解説します。タグは英語を略しhrです。

サンプルコード

<html>
<head>
<title>タイトル</title>
</head>
<body>
セクション1,1行目<br>
セクション1,2行目
<hr>
セクション2,1行目<br>
セクション2,2行目
</body>
</html>

実行結果

セクション1,1行目
セクション1,2行目
セクション2,1行目
セクション2,2行目

水平線に関してHTML5では注意が必要です。HTML4.01までの水平線は装飾性の強いものでした。HTML5へのバージョンアップによってhrタグはセクションの境目という明確な意味をもつようになりました。セクションについては後々解説をしますが、簡単に言えば、装飾目的で引くのではなく内容の境目で引きましょう、ということです。