HTMLの開始と終了
HTML文書を作成する際、必ず開始と終了を示すタグが必要です。これらのタグは、ブラウザに対してどこからどこまでがHTML文書なのかを明示的に伝える役割を果たします。この記事では、HTML文書の基本的な構造と、主要なタグの開始と終了について解説します。
HTML文書の基本構造
HTML文書は、
<html>タグで始まり、
</html>タグで終わります。
<html>や
<head>の方を「開始タグ」と呼び、単語の前に「/」(スラッシュ)がある
</html>と
</head>の方を「終了タグ」と呼びます。 この開始タグと終了タグの間に、様々な要素を記述することでWebページの内容が構成されます。基本的な構造は以下の通りです。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ページのタイトル</title>
</head>
<body>
<!--ここにページの内容を記述する-->
</body>
</html>主要なタグの開始と終了
以下は、HTML文書でよく使われるタグの開始タグと終了タグ、そしてその役割をまとめた表です。
| タグ名 | 開始タグ | 終了タグ | 役割 |
|---|---|---|---|
| html | <html> | </html> | HTML文書の開始と終了を示す |
| head | <head> | </head> | ページのタイトルやメタ情報を記述する |
| title | <title> | </title> | ページのタイトルを記述する |
| body | <body> | </body> | ブラウザに表示されるページの内容を記述する |
| h1〜h6 | <h1>〜<h6> | </h1>〜</h6> | 見出しを記述する (h1が最も大きく、h6が最も小さい) |
| p | <p> | </p> | 段落を記述する |
| a | <a href="リンク先URL"> | </a> | リンクを作成する |
| img | <img src="画像のURL" alt="代替テキスト"> | (終了タグなし) | 画像を表示する |
まとめ
HTML文書は、開始タグと終了タグで囲まれた要素によって構成されます。これらのタグを正しく理解し、適切に利用することで、意図した通りのWebページを作成することができます。 特に、終了タグを忘れないように注意しましょう。終了タグがないと、レイアウトが崩れたり、意図した表示にならないことがあります。
関連QA
Q1: 開始タグと終了タグの間に何も記述しない要素はありますか？
A1: はい、存在します。例えば、画像を表示する
<img>タグや、改行を表す
<br>タグなどは終了タグを持ちません。
Q2: HTMLのタグは大文字と小文字どちらで書いてもいいですか？
A2: HTML自体は、大文字と小文字を区別しません。 しかし、HTML5以降は、小文字で記述することが推奨されています。
Q3: タグの記述に誤りがあった場合、どうなりますか？
A3: ブラウザは、タグの記述に誤りがあると、正しくページを表示できないことがあります。誤りを修正するために、ブラウザの開発者ツールなどを活用すると良いでしょう。