ブロックレベル要素とインライン要素

HTML要素の構造 HTML文書は一つのhtml要素からなります。
さらに html要素は head 要素と body 要素からなります。
そして、body 要素の中で使える要素（タグ）は大きく「ブロックレベル要素」と「インライン要素」の二つに分類することができます。

ブロックレベル要素

「ブロックレベル要素」とは、見出し（h1〜h6）・段落（p）・リスト（ul/ol ）・テーブル（table）など、文書の基本的な構造を示すものです。その名の通り「ブロック（矩形）」として、要素の前後に改行を伴った表示がされます。 ブロックレベル要素の主なタグは次の通りです。

p / h1〜h6 / ul / ol / dir / pre / dl / div / noscript / blockquote / form / hr / table /fieldset / adress

インライン要素

「インライン要素」は強調文字（strong）・リンク（a）といったテキストに装飾をしたり機能をもたせる、あるいは改行（br）のようにテキスト内のある部分に対して何らかの意味づけをしたりする機能を持たせるものです。インライン要素の前後には改行は含まれません。*1 インライン要素の主なタグは次の通りです。

i / b / u / s / em / strong / code / a / img / object / font / br / span / iframe / input / select / textarea / label / button / layer / 単なるText

ブロックレベル要素とインライン要素の関係

ブロックレベル要素とインライン要素を記述するにあたって、次のような関係（制約）があります。エントリーの記述にあたって気をつけなければならないものを挙げておきます
  • ブロックレベル要素の内容に、他のブロック要素やインライン要素を含むことができます（例外あり）
  • インライン要素の中にブロックレベル要素を含むことはできません
  • p 要素はブロックレベル要素ですが、子要素としてインライン要素しかもつことができません
  • div 要素・blockquote 要素は子要素としてブロックレベル要素しかもつことができません
  • ul / ol / dl / hr / table の各要素の内容モデルは決まっています（例えば ul は li ）
  • HTML4.0/XHTML1.0 Strict の場合、body要素の直接の子要素としてインライン要素を記述することはできません（Transitional はOK）
  • li / dt / dd / td / tr 等は「内容モデル（ある要素の子要素になることができる要素）」として扱われるだけで、どちらの要素にも該当しません

参考サイト

  • NEXTindex：HTML 文書とはなんだろうか
  • The Web KANZAKI：ブロックレベル要素とインライン要素
  • ぴよぴよ実験室：HTMLメモ（for 自分）
  • とほほのWWW入門：HTMLのタグと要素