要素
初級読み方：ようそ｜英語：Element
開始タグ + 内容 + 終了タグ をまとめた単位だよ。例：<p>文章</p> 全体が1つの要素。いつ使う？ HTMLの構造を説明するときに「要素」という言葉を使うよ。「p要素」「div要素」のように呼ぶよ。間違いやすいポイント: 「タグ」と「要素」は違うもの。<p>はタグ、<p>文章</p>全体が要素だよ。混同しやすいけど区別しよう。
やさしい説明
要素（ようそ）とは、「開始タグ＋内容＋終了タグ」をまとめた1つの単位です。HTMLのページは、要素の組み合わせでできています。
レゴブロックに例えると、1つ1つのブロックが「要素」です。ブロックを組み合わせて家や車を作るように、要素を組み合わせてWebページを作ります。
「タグ」と「要素」は似ていますが違います。タグは <p> や </p> のような記号のこと。要素は <p>文章</p> 全体のことです。
要素の中に別の要素を入れることもできます。これを「入れ子（ネスト）」と言います。
具体例・使い方
要素の構造を見てみましょう。
<!-- これが1つの「p要素」 -->
<p>こんにちは</p>
│ │ │
│ │ └─ 終了タグ
│ └─ 内容（コンテンツ）
└─ 開始タグ
<!-- 要素の入れ子（ネスト） -->
<div>
<h1>タイトル</h1>
<p>説明文です。</p>
</div>いつ使う？
HTMLを書くときは常に要素を作っています。見出し要素、段落要素、リンク要素——ページに何かを追加するたびに、新しい要素を1つ作ることになります。
間違いやすいポイント
❌ 「タグ」と「要素」を混同する
<p> はタグ。<p>文章</p> は要素。会話では混ぜて使われることも多いですが、正確には違うものです。
❌ 入れ子のルールを破る
<!-- ❌ p要素の中にdiv要素は入れられない -->
<p><div>ダメ</div></p>
<!-- ✅ divの中にpを入れるのはOK -->
<div><p>OK</p></div>よくある疑問
Q: タグと要素の違いは？
A: <p>は「開始タグ」、</p>は「終了タグ」、<p>こんにちは</p>全体が「p要素」です。タグは要素の一部分です。
Q: 要素の中に要素を入れていい？
A: はい、入れ子（ネスト）にできます。例: <div><p>文章</p></div>。ただし正しい入れ子のルールがあります。
Q: 空要素とは？
A: 内容を持たない要素のことです。<img>、<br>、<input>などが空要素です。終了タグは書きません。
関連用語
📖 関連レッスン
レッスンを見る →