タグは “ここは○○だよ” と教えてあげる目印でした。今回は、その目印のかたちをちゃんと知ります。ここさえ分かれば、HTMLの8割は読めるようになります。ほんとです。
開始タグと終了タグ
たとえば「これは段落だよ」と伝えたいとき、こう書きます。
<p>こんにちは。しまちゃんです。</p>分解するとこうです。
| 部分 | 意味 |
|---|---|
<p> | 開始タグ。「ここから段落が始まるよ」 |
こんにちは。はじめてのHTMLです。 | 中身 |
</p> | 終了タグ。「段落はここまでだよ」(/ が付く) |
パンで具(中身)をはさむイメージ。上のパンが開始タグ、下のパンが終了タグです。開始と終了で同じ名前を使うのがポイント。<p> で始めたら、閉じるのも </p> です。
タグは「種類」を表している
p はparagraph(段落)の頭文字。名前が変われば、意味も変わります。
<h1>しまちゃん</h1>
<p>おえかきがすきです。</p><h1> は見出し、<p> は段落。同じ “はさむ” かたちで、名前だけを変えて種類を伝える——これがHTMLのすべての基本です。名前を差し替えるだけ、と思えば、たくさんのタグも急にやさしく見えてきます。
タグの中に、タグを入れられる
タグは、中にべつのタグを入れることもできます。これを入れ子(ネスト)と呼びます。
<p>しまちゃんは <strong>おえかき</strong> がだいすきです。</p><strong> は「ここは強調だよ」の目印。段落 <p> の中に、強調 <strong> がすっぽり入っています。箱の中に小さな箱を入れるイメージ。この“入れ子”はHTMLのいたるところで出てきます。
このレッスンのまとめ
- タグは
<名前>〜</名前>で中身をはさむ - 終了タグには
/が付く - 名前で種類を伝えている(
pは段落、h1は見出し…)