取り上げた要素タイプの一覧
簡単で正確なHTMLのシリーズで取り上げている(もしくは予定の)要素タイプを列挙しておきます。全体像の把握に、また索引としてご利用ください。
要素タイプインデックス
「簡単で正確なHTML」はXHTML1.0/HTML 4.01の要素タイプ(要素型)全てを取り上げているわけではありませんが、文書の構造をきちんと記述して分かりやすいオンラインドキュメントを公開するためには十分な範囲をカバーしています。
以下は、それらの要素タイプをHTML 4.01の仕様書での区分(章)に従って、そこでの登場順に表にしたものです。本シリーズの区分とは異なっています。
*仕様書の1〜6章は全体定義などに当てられ、個別の要素タイプ解説は7章から始まります。第8章は使用言語に関する情報(国際化)についてです。
仕様書の章 | 要素型名 | 要素の役割 | 親要素 | 子要素(内容) |
---|---|---|---|---|
7. 全体の構造 | html | HTML文書全体を包含する | (ルート) | head, body |
head | 文書自身に関する情報 | html | title, meta, linkなど | |
title | 文書の表題 | head | 文字列 | |
meta | 文書に関する特別な情報 | head | 空 | |
body | 文書の本文 | html | Block | |
div | ブロックレベル要素のグループ化 | Blockコンテナ | Block | |
span | フレーズのグループ化 | Inlineコンテナ | Inline | |
h1-h6 | 見出し | Blockコンテナ | Inline | |
address | 作者に関する情報 | Blockコンテナ | Inline | |
9. テキスト | em | 強調 | Inlineコンテナ | Inline |
strong | さらに強調 | Inlineコンテナ | Inline | |
dfn | 定義語 | Inlineコンテナ | Inline | |
cite | 引用元(出典) | Inlineコンテナ | Inline | |
abbr | 省略語 | Inlineコンテナ | Inline | |
acronym | 頭字語 | Inlineコンテナ | Inline | |
blockquote | ひとかたまりの引用 | Blockコンテナ | Block | |
q | 文中での引用 | Inlineコンテナ | Inline | |
sub | 下付文字 | Inlineコンテナ | Inline | |
sup | 上付文字 | Inlineコンテナ | Inline | |
p | 段落 | Blockコンテナ | Inline | |
br | 改行 | Inlineコンテナ | 空 | |
pre | 整形済みテキスト | Blockコンテナ | インライン* | |
ins | 追加テキスト | body以下の任意 | 親に準ずる | |
del | 削除テキスト | body以下の任意 | 親に準ずる | |
10. リスト | ul | 箇条書きリスト | Blockコンテナ | li |
ol | 番号付きリスト | Blockコンテナ | li | |
li | リストの項目 | ol,ul | 任意 | |
dl | 定義型リスト | Blockコンテナ | dt,dd | |
dt | 定義される用語 | dl | Inline | |
dd | 定義内容 | dl | 任意 | |
11. テーブル | table | テーブル | Blockコンテナ | Table内容 |
caption | テーブルの表題 | table | Inline | |
thead | テーブルヘッダ | table | tr | |
tbody | テーブル本体 | table | tr | |
tfoot | テーブルフッタ | table | tr | |
colgroup | 列のグループ | table | col | |
col | 列についての情報 | table, colgroup | 空 | |
tr | テーブルの行 | Tableコンテナ | th, td | |
td | テーブルのセル | tr | 任意 | |
th | 見出しとなるセル | tr | 任意 | |
12. リンク | a | 本文中でのリンクのアンカー | Inlineコンテナ | Inline |
link | 文書自身と関連リソースのリンク | head | 空 | |
13. オブジェクト | img | インライン画像 | Inlineコンテナ | 空 |
14. スタイル | style | スタイルシート | head | スタイル定義 |
15. レイアウト | hr | 横罫線 | Blockコンテナ | 空 |
17. フォーム | form | フォーム本体 | Blockコンテナ | form以外の任意 |
input | 入力コントロール | Inlineコンテナ | 空 | |
select | 選択メニュー | Inlineコンテナ | option,optgroup | |
option | 選択肢 | select | 文字列 | |
textarea | テキストエリア | Inlineコンテナ | 文字列 | |
label | コントロールのラベル | Inlineコンテナ | label以外のInline | |
fieldset | コントロールのグループ化 | Blockコンテナ | legend,任意 | |
legend | グループのラベル | fieldset | Inline | |
optgroup | メニューのグループ化 | select | option |
*link要素は「少し詳しいHTMLの説明」シリーズで紹介
親要素と子要素
基本要素の章で説明したように、HTMLの要素は親子関係を持ち、それぞれ親になれるもの、子になれるものが定められています。ここでは、厳密なDTDの定義ではなく、実際にタグを書いていく上で理解しやすいようにアレンジして親子関係を整理してみました(ここで使っているBlock, InlineはDTDの%block;、%inline; と正確には一致しません)。詳しくは以下の注意点を参照してください。
- 親要素、子要素の欄で具体的な要素名が記述されているのは、その要素タイプのみが親子となります。
- 親が「Blockコンテナ」となっているものは、ブロックレベル要素のグループに属し、子要素が「Block」もしくは「任意」となっている要素の内容になります。一般にはbodyもしくはdiv要素の内容として考えておくとよいと思います。
- 親が「Inlineコンテナ」となっているものは、インライン要素のグループに属し、子要素が「Inline」となっている要素の内部で使うのが原則ですが、そのほか「任意」の要素の内容になることができます。
- 子要素欄に「Block」とあるものは、原則としてブロックレベル要素に属する要素を内容としますが、インライン要素や文字列を持ってくることもできます。
- 子要素欄に「Inline」とあるものは、インライン要素に属する要素と文字列を内容とすることができます。
- pre要素の場合、img, sup, subなどの文字幅を変える可能性のある要素は除外されます。
- 「任意」は、ブロックレベル要素、インライン要素および文字列を指します。head要素とその子要素は含みません。
- 「Tableコンテナ」は、thead, tbody, tfootを指しています。ただし、tbodyが略されていると見なして、trを直接tableの子要素とすることもできます。「Table内容」はTableコンテナ+caption, colgroup, colを指します。
- ins/del要素はbody内の任意の位置に記述でき、内容モデルも「任意」ですが、親要素がインライン要素の場合は、内容もインライン要素に限ります。
HTML 4で定義されている要素タイプ全体の親子関係は、HTML 4のDTDの木構造を参照してください。また、XHTMLのモジュールとそこで定義される要素タイプに関しては、XHTML抽象モジュールの簡易定義(早わかり)を参照してください。