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>：Privacy Policy へのクリック可能なリンクを作成；
• <strong>...</strong>：「website」という単語を太字にして強調。