HTML5の基礎知識~メタデータその2~
素人が書く備忘録
基本的にはHTML 5.2を元に記載。
メタデータ
head要素内にメタデータコンテンツに属する要素を記載する。
meta要素
カテゴリ:
メタデータコンテンツ
コンテンツモデル:
なし
コンテンツ属性:
・グローバル属性
・name属性 — メタデータの名前を指定(keywordやdescriptionなど)。
・http-equiv属性 — プラグマディレクティブ。
・content — 値を指定。
・charset — エンコードを指定(UTF-8など)。
タグの記載場所:
・charset属性が存在する場合またはhttp-equiv属性が存在していてエンコーディングが指定されている場合は、head要素内に記載。
・http-equiv属性が存在するがエンコーディングの指定がない場合は、head要素内またはhead要素の子要素であるscript要素に記載。
・name属性が存在する場合、メタデータコンテンツを配置できる場所に記載。
- ドキュメントの文字コードや概要などの情報を記載。
- title、base、link、style、およびscript要素で指定できないものを記載。
- name、http-equiv、charset属性のいずれか1つを指定しなければならない。
- nameまたはhttp-equiv属性が指定された場合、content属性を指定しなければならない。それ以外では省略しなければならない。
- charset属性は1ドキュメントに1つのみ指定可能。
ex. <meta name="keywords" content="chocopai">
style要素
カテゴリ:
メタデータコンテンツ
コンテンツモデル:
type属性に依存
コンテンツ属性:
・グローバル属性
・media … メディアクエリ
・nonce … Content Security Policyの暗号ノンスの設定
・type … 埋め込むリソースの種類
・title … 代替スタイルシートの名前
タグの記載場所:
・メタデータコンテンツを配置できる場所に記載。
・head要素の子要素として存在するscript要素内に記載。
・body要素内では、フローコンテンツが配置可能な場所に記載。
ex. <style> div { margin: 0; } </style>
script、noscript、template要素は別のところで記載。