HTMLにおけるペアタグとシングルタグの理解

HTML では、ペアタグと単一（自己終了）タグの2種類のタグを使用。各タグはウェブページの構造化において異なる役割を持つ。

ペアタグ

ペアタグは開始タグと終了タグを持つ。コンテンツを囲み、要素をグループ化し、意味や構造を定義。

構文：

<tag_name>Some content</tag_name>

ペアタグを使用した実際の例：

この例では：

• <section>...</section>：関連するコンテンツをまとめる；
• <h1>...</h1>：セクションの見出しを追加；
• <p>...</p>：ほとんどのHTMLタグがペアであることを説明する段落を含む。

シングルタグ

シングルタグは閉じタグを持ちません。 内部コンテンツが不要で、すべての動作が属性によって定義される場合に使用されます。

構文:

<tag_name />

以下はシングルタグを使用した実際の例です:

このコードには2つの要素が含まれています:

• <input />: テキスト入力フィールドを作成します。placeholder=" name"はボックス内にヒントを表示します。
• <img />: フルーツの画像を表示します。
  • alt="Fruits": 画像が読み込めない場合に表示されるテキスト。
  • width と height: 画像のサイズを指定します。
  • src: 画像のURLを指定します。

タグの入れ子構造

タグはマトリョーシカ人形のように正しく入れ子にする必要があり、それぞれの終了タグは対応する開始タグと正しい順序で一致しなければなりません。

入れ子になったタグの例:

<tag1>
  <tag2>
    <tag4>...</tag4>
    <tag5>...</tag5>
  </tag2>
  <tag3>
    <tag6>...</tag6>
  </tag3>
</tag1>

次の有効な例を考えます:

このコードは、リンクと強調されたテキストを含む段落を表示します：

• <p>...</p>：段落全体を囲むタグ；
• <a href="https://privacy.com">...</a>：プライバシーポリシーへのクリック可能なリンクを作成；
• <strong>...</strong>：「website」という単語を太字にして強調。