Oimo のお勉強ノート

勉強したことのメモを残す

【HTML5プロフェッショナル認定試験レベル1】試験勉強まとめ(HTMLの構造と要素の種類)

HTML5プロフェッショナル認定試験レベル1の試験勉強まとめ(HTMLの構造と要素の種類)です。

HTMLの構造

  • DOCTYPE宣言・・・大文字でも小文字でもOK。html の前後には空白文字利用OK。
  • html要素
    • head要素
    • body要素
<!DOCTYPE html>
<html>
    <head>

    </head>
    <body>

    </body>
</html>

要素の種類

要素は大きく分けて以下2種類に分類される:

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

コンテンツモデル

要素に入れられる内容のこと。

トランスペアレント

親要素のコンテンツモデルがそのまま自分のコンテンツモデルになる要素のこと。全部で9要素

  • a
  • ins
  • del
  • object
  • del
  • object
  • audio
  • video
  • canvas
  • map
  • noscript

カテゴリー

フローコンテンツ

自由な場所に配置できる要素。(特定の位置にしか配置できないコンテンツでない要素。)

見出しコンテンツ

h1〜h6の見出し要素。

セクショニングコンテンツ

区分要素。全部で4要素。

  • article
  • aside
  • nav
  • section

フレージングコンテンツ

文書とその中に含まれるマークアップの定義を行う要素。

組み込みコンテンツ

文書に他のリソースを取り込んだり、他のマークアップ言語や名前空間を挿入したりする要素。全部で8要素。

  • audio
  • canvas
  • embed
  • iframe
  • img
  • object
  • picture
  • video

インタラクティブコンテンツ

ユーザーとのやりとりのために固有にデザインされた要素。

  • a
  • button
  • input

など

メタデータコンテンツ

メタ情報の要素。全部で8要素。

  • base
  • link
  • meta
  • noscript
  • script
  • style
  • template
  • title

タグが省略できる要素・空要素

注意:省略可能な条件がある要素もあるので要確認。

開始タグ・終了タグ共に省略可能な要素

全部で5要素

  • html
  • head
  • body
  • colgroup
  • tbody

終了タグのみ省略可能な要素

リストの項目、ルビ関連、選択肢、テーブル要素が該当。

  • li・・・リストの項目
  • dt・・・定義リストの定義の項目
  • dd・・・定義リストの説明の項目
  • p
  • rb・・・ルビ(漢字)
  • rt・・・ルビ(ふりがな)
  • rtc・・・rtのグループ化
  • rp・・・ルビ(括弧)
  • option・・・selectまたはdatalistの選択肢
  • optgroup・・・optionのグループ化
  • thead・・・テーブルのヘッダー
  • tfoot・・・テーブルのフッター
  • tr・・・テーブルの行(横一列)
  • td・・・テーブルのセル(データ)
  • th・・・テーブルのセル(見出し)

空要素

終了タグの無い要素。

  • img
  • input
  • br など