気の向くままに辿るIT/ICT/IoT
HTML/XHTMLタグ・要素・属性・属性値

HTML5/HTML4から引き継がれた要素・タグ一覧

ホーム前へ次へ
HTML5にはHTML4から継承された要素・タグはあるの?

HTML5要素・タグ一覧【HTML4継承要素】

HTML5/HTML4から引き継がれた要素・タグ一覧

 HTML5の要素は全108要素、内HTML4から引き継がれた要素は91要素中78要素あります。

 これらHTML要素をwebzoit独自の分類として13系統に分類、継承された要素数をそれぞれ調べてみました。

webzoit分類リンク
構造系table要素系form要素系
入出力書式系フォント系リスト系
プラグイン系マルチメディア系部分修正系
定義系特殊文字系アンカー系
国際化

 内訳としては、構造関連の21要素、table要素関連とform要素関連で10要素(小計41要素)、リスト関連とフォント系要素及び入出力書式関連では各6要素(小計18要素)、プラグイン・組み込み要素関連で5要素、マルチメディア関連で4要素、部分修正関連の3要素、アンカー関連と特殊文字関連及び定義系が各2要素(小計6要素)、国際化関連で1要素がHTML4から引き継がれています。

 尚、HTML5においては、この内、アンカー関連要素、リスト関連要素、部分修正関連要素の3系統には追加された要素もなく要素の増減はありません

【構造関連】HTML4 => HTML5継承20+1=21要素

要素説明
htmlHTML文書のルート要素
headドキュメントのメタデータのコンテナ
titleドキュメントのタイトル
linkリンク用メタデータ(データの為のデータ)
metaテキストのメタデータ
bodyHTML文書のボディ部(本文記述部)
addressページまたはセクション(章)の連絡先情報
例:<address>アジア近郊</address>
h1Header1/セクションの見出し
h2Header2/セクションの見出し
h3Header3/セクションの見出し
h4Header4/セクションの見出し
h5Header5/セクションの見出し
h6Header6/セクションの見出し
hrHoRizon/水平線(横罫線)・テーマ区切り
pParagraph/段落
blockquote別のソースから引用されたセクション
qQuote/同一行内において引用符を使用するようなシチュエーションで使用
brBReak line/改行
divDIVideまたはDIVision/一般的な流れの(ブロック)コンテナ
span一般的なフレーズの(インライン)コンテナ
要素説明
menuHTML5でコマンド系メニューとして再定義

 menu要素についてはHTML4でも定義されてはいましたが、HTML4では、このページでリスト系要素として分類しているul要素と同様の機能として想定され、後に非推奨となったものの、HTML5では、type属性と併せてプルダウンメニューやボタンメニュー、更にはツールバーのようにポイントやクリックするとサブメニューが表示されるような用途で0個以上のli要素を子要素として持つ要素として再定義されています。

【アンカー関連】HTML4 => HTML5継承2要素

要素説明
aAnchor/ハイパーリンク・アンカー
base【サイトURLを基準とするケース】

基準となるパス(自サイト内アンカーでドメインを省略する場合等)
<html>
<head>
<base href="https://www.webzoit.net/">
</head>
<body>
<a href="/hp/"></a>
</body>
</html>

この場合、Webサーバ上にある場合は、たいていbase要素を省略してもWebサーバが適切なページを探して表示するがローカルでWebサーバを介さない場合などはbase要素に適切な指定がないとリンク先に飛べない
【カレント(現在の)ページを基準とするケース】

またlink要素のrel(relationship)とrev(reverse)属性に説明をhref属性にURLを記述、これらを併用し、現在表示しているページを基準としてページの前後関係を示すことも想定されている

【table要素関連】HTML4 => HTML5継承10要素

要素説明
tableテーブル・表組み
captionテーブルキャプション(表題)
theadTable HEADer/テーブルの見出し行のグループ
tfootTable FOOTer/テーブルのフッター行のグループ
tbodyTable BODY/テーブル内の行のグループ化
trTable RowsまたはRecords/表の行
thTable Header/テーブルの見出しセル
tdTable Data/テーブルセル
colCOLumn/table要素内の列(表の列)
colgrouptable要素内の列のグループ

 HTML4仕様のtable要素のsummary属性が、HTML5ではtable要素の属性としては除外され、他方、汎用detail要素の子要素としてのsummary要素として新たに定義されていますが、用途が異なる為、このリストには入れてません。

 HTML5でも汎用的な要素なのでtable内でもcaption要素(tableの表題)の子要素としてdetails要素(表題の詳細)、ひいてはsummary要素(詳細の要約)を使用できるようです。

 また、HTML4でもそうでしたが、HTML5でも禁止ではないものの、より一層、極力table構造をレイアウトとして利用しないようアナウンスされており、視聴が困難なユーザー向けのブラウザ機能上、表組みでは機能上弊害はなくとも(table構造を)レイアウトとして利用すると、そうしたユーザーにとって不便となる可能性が高いことが理由として挙げられています。

 尚、HTML5ではtable要素の旧HTML仕様ではtableの枠線用属性であったborder属性の役割をCSSに完全移行、border属性に1を設定することで当該table構成がレイアウト用途でないことを示すという半ば苦肉の策ともいえるような仕様変更を行っています。

 ちなみに推奨されるのはCSSテーブルモデルやCSSポジショニングなどによるレイアウトであり、また、table要素には過去の仕様と異なるtableがレイアウトとして使われていないことを明示的に示すborder属性(属性値はカラ文字列か"1")が定義されており、更にtable仕様には、tableが表組み、レイアウトいずれで使われているかをブラウザUA(ユーザーエージェント)が何を元にどのように判定するかが例示されています。

【リスト要素関連】HTML4 => HTML5継承6要素

要素説明
dtdd要素の凡例(複数可)
dddt要素と一致するコンテンツ(複数可)
dlDataList/0個以上の名前から成る関連リスト・単独またはdd/dt要素とセット
ulUnordered List/(番号付きではない)一覧
olOrder/Odinal List/順序付きリスト
liLIst/リストの各項目

【form要素関連】HTML4 => HTML5継承10要素

要素説明
formユーザーフォーム
button(必要に応じた実行)ボタンコントロール
labelフォームコントロールのキャプション
legendフィールドセットのためのキャプション
fieldsetフォームコントロールのグループ
selectリストボックスコントロール
inputフォームの制御
optgroupリストボックスのオプションのグループ化
optionリストボックスまたはコンボボックスコントロールのオプション
textarea複数行のテキストフィールド

【フォント系要素関連】HTML4 => HTML5継承6要素

要素説明
bBold/太字
例:<b>太字</b>
emEMphasis/強調・力説・重点(イタリック体+太字)
strong強調/重要
small小文字・補足コメント
uUnderline/下線
 i Italic/イタリック体(斜字)

【特殊文字関連】HTML4 => HTML5継承2要素

要素説明
subSUBscript/下付き文字
例:<sub>下付き文字</sub> => 下付き文字
supSUPerscript/上付き文字
例:<sup>上付き文字</sup> => 上付き文字

【部分修正関連】HTML4 => HTML5継承3要素

要素説明
delDELete/文書からの削除
insINSert/(文書への)追加
sStrike/抹消線・打ち消し線(不正確なテキスト)

【定義要素関連】HTML4 => HTML5継承2要素

要素説明
abbrABBReviation/略語
例:<abbr title="Information Technology">IT</abbr>
dfnDeFiNition/インスタンスの定義
例:
<dfn id="w3c">
<abbr title="World Wide Web Consortium">W3C</abbr>
</dfn>

【入出力書式関連】HTML4 => HTML5継承6要素

要素説明
cite作品のタイトル
codeコンピュータコード
varVARiable/変数
kbdKeyBoarD/ユーザの入力
sampSAMPle/コンピュータ出力
pre整形済みテキストのブロック・入力通りに表示

【マルチメディア関連】HTML4 => HTML5継承4要素

要素説明
imgIMaGe/画像・イメージ
areaイメージマップ上のハイパーリンク領域またはデッド領域
mapイメージマップ
iframe別URLのページの埋め込み・入れ子

【スクリプト・プラグイン関連】HTML4 => HTML5継承6要素

要素説明
style埋め込みCSS/インラインスタイル
script埋め込みスクリプト
noscriptスクリプトのためのフォールバックコンテンツ/スクリプトを利用できないユーザーへのアナウンス
object画像・別URLページのネスト(入れ子)やプラグイン
paramPARAMeter/オブジェクトのパラメータ

 embed要素については、昔からあるものの実はHTML4仕様ではないのでHTML5で新たに追加された仕様となる為、ここにはリストアップしていません。

 embed要素は、ブラウザNetscape Navigatorにおいて初期の段階で独自拡張され、後にIEも同様の拡張を行われた為、NN/IEという二強時代を知る人々にとっては特に意外かもしれませんがHTML4として標準仕様化されていません。

【国際化関連】HTML4 => HTML5継承1要素

要素説明
bdoテキストの方向の書式設定
右書き/左書き/I18N BiDi over-ride

各種HTMLとHTMLタグ/要素・属性・属性値

ホーム前へ次へ