HTML5.1全要素・属性一覧(K~Wまで)
前回は、HTML5.1全要素・属性一覧(A~Iまで)を一覧にて記載いたしました。
アルファベット順、頭文字A~Iまでだけでも結構なボリュームです…。
やはり、この一覧を見ながらでも、しっかりとマークアップしたHTMLと大雑多なマークアップをしたHTML、実は見た目はマークアップの仕方によって、ほぼ変わらないものと思いますが、googlebot君がソースコードを読むことななると話は別です。
なので極力しっかりとしたマークアップをおこなうことをおすすめします。
という事で、それでは今回はッ、
・HTML5.1全要素・属性一覧(K~Wまで)
上記について記載していこうと思います…。
HTML5.1全要素・属性一覧(K~Wまで)
それでは、前回に引き続き一覧にてHTML5の要素と属性を記載いたします。
要素名 | 属性名 | 説明 | 参照 |
---|---|---|---|
kdo | ユーザーが入力する文字 | html step11 | |
グローバル属性 | id・class・title・lang・styleなど | ||
keygen | 公開key・秘密keyのペアを生成する部品 | ||
challenge | チャレンジ・データ | ||
keytype | 生成する暗号keyの種類 | ||
name | データとセットになってい送信される項目名 | ||
autofocus | ロードされると同時にこの部分にフォーカス | ||
disabled | 部分を無効にする | ||
form | この部品と関連付けるフォームのid | ||
グローバル属性 | id・class・title・lang・styleなど | ||
label | フォーム関連部分のラベル | ||
for | 関連付ける部分のid | ||
グローバル属性 | id・class・title・lang・styleなど | ||
legend | fieldset要素のタイトル | html step21 | |
グローバル属性 | id・class・title・lang・styleなど | ||
li | リスト内の項目 | html step7 | |
value | ol要素の子要素である場合のマーカーの番号 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
link | 関連ファイル | html step4 | |
href | 関連ファイルのURL | ||
hreflang | 関連ファイルの言語 | ||
rel | 関連ファイルは何か | ||
rev | 関連ファイルから見てこのページは何か | ||
type | 関連ファイルのMIMEタイプ | ||
media | メディアクリエ | ||
sizes | アイコン画像の大きさ | ||
crossorigin | CORSの認証の設定 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
main | メインコンテンツ | html step6 | |
グローバル属性 | id・class・title・lang・styleなど | ||
map | イメージマップの定義 | ||
name | イメージマップの名前 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
mark | 注目してもらうために目立たせる部分 | html step11 | |
グローバル属性 | id・class・title・lang・styleなど | ||
menu | コンテキストメニュー | ||
type | メニューの種類 | ||
label | 入れ子にして階層メニューにする時のラベル | ||
グローバル属性 | id・class・title・lang・styleなど | ||
menuitem | コンテキストメニューの項目 | ||
type | 項目の種類 | ||
label | 項目のラベル | ||
icon | アイコンとして表示させる画像のURL | ||
disabled | 項目を無効にする | ||
checked | 項目をチェックされた状態にする | ||
radiogroup | 連動して動作させる項目に共通して付ける名前 | ||
default | 項目をデフォルトにする | ||
グローバル属性 | id・class・title・lang・styleなど | ||
meta | メタ情報 | html step4 | |
name | メタ情報の名前 | ||
content | メタ情報の値 | ||
http-equiv | このページの状態または実行命令 | ||
charset | このページの文字コード | ||
グローバル属性 | id・class・title・lang・styleなど | ||
meter | メーター | ||
value | メーターの示す値 | ||
min | メーターの示す範囲全体の下限 | ||
max | メーターの示す範囲全体の上限 | ||
low | 範囲を低・中・高に分割した場合の低の上限 | ||
high | 範囲を低・中・高に分割した場合の高の下限 | ||
optimum | 低・中・高のどれが最適何か示す値 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
nav | ナビゲーションのセクション | html step5 | |
グローバル属性 | id・class・title・lang・styleなど | ||
noscript | スクリプトが動作しない環境向けの内容 | html step22 | |
グローバル属性 | id・class・title・lang・styleなど | ||
object | 様々な種類のデータの組み込み | html step14 | |
data | 組み込むデータのURL | ||
type | 組み込むデータのMIMEタイプ | ||
typemustmatch | 指定したMIMEタイプと一致する場合のデータを使用 | ||
name | target属性で表示先として指定する際の名前 | ||
form | 組み込むデータと関連付けるform要素のid | ||
width | 表示させる領域の幅 | ||
height | 表示させる領域の高さ | ||
グローバル属性 | id・class・title・lang・styleなど | ||
ol | リスト全体:連番あり | html step7 | |
type | グループのラベル | ||
reversed | グループを無効にする | ||
start | 連番の開始番号 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
optgroup | select要素の選択肢のグループ | html step20 | |
label | グループのラベル | ||
disabled | グループを無効にする | ||
グローバル属性 | id・class・title・lang・styleなど | ||
option | select要素・datalist要素の選択肢 | html step20 | |
label | 選択肢のラベル | ||
value | 送信される値 | ||
selected | 選択肢からあらかじめ選択されている状態にする | ||
disabled | 選択肢を無効にする | ||
グローバル属性 | id・class・title・lang・styleなど | ||
output | 計算結果を表示させる部品 | ||
for | 計算のもとになった要素のid | ||
name | データとセットになって送信される項目名 | ||
form | この部品と関連付けるフォームのid | ||
グローバル属性 | id・class・title・lang・styleなど | ||
p | 段落 | html step5 | |
グローバル属性 | id・class・title・lang・styleなど | ||
param | object要素のパラメーター | ||
name | パラメーターの名前 | ||
value | パラメーターの値 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
picture | 候補画像を入れる要素 | html step12 | |
グローバル属性 | id・class・title・lang・styleなど | ||
pre | 整形済みテキスト | html step9 | |
グローバル属性 | id・class・title・lang・styleなど | ||
progress | プログレスバー | ||
value | 処理の進み具合を示す現在地 | ||
max | 処理の全体量を示す上限値 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
q | 引用文 | html step10 | |
cite | 引用元のURL | ||
グローバル属性 | id・class・title・lang・styleなど | ||
rb | 漢字部分 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
rp | ルビに未対応の環境で使用するカッコ | html step9 | |
グローバル属性 | id・class・title・lang・styleなど | ||
rt | ふりがな部分 | html step9 | |
グローバル属性 | id・class・title・lang・styleなど | ||
rtc | rt要素のグループ化 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
ruby | ルビ全体 | html step9 | |
グローバル属性 | id・class・title・lang・styleなど | ||
s | 正しくない部分および関係のない部分 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
samp | コンピューターによる出力 | html step11 | |
グローバル属性 | id・class・title・lang・styleなど | ||
script | スクリプト | html step22 | |
src | 外部スクリプトのURL | ||
type | スクリプトのMIMEタイプ | ||
charset | 外部スクリプトの文字コード | ||
defer | 非同期で読み込み、読み込み完了後すぐに実行 | ||
async | 非同期で読み込み、ページ解析処理の後に実行 | ||
crossorigin | CORSの認証の設定 | ||
nonce | CSPのノンス | ||
グローバル属性 | id・class・title・lang・styleなど | ||
section | 一般的なセクション | html step5 | |
グローバル属性 | id・class・title・lang・styleなど | ||
select | 複数項目から選択する部分 | html step20 | |
name | データとセットになって送信される項目名 | ||
size | ユーザーに見える状態にする選択肢の数 | ||
multiple | 複数の選択肢を選択可能にする | ||
disbled | 部品を無効にする | ||
required | 選択を必須にする | ||
autofocus | ロードすると同時にこの部分にフォーカスさせる | ||
form | この部品と関連付けるフォームのid | ||
グローバル属性 | id・class・title・lang・styleなど | ||
small | 副次的な注記 | html step10 | |
グローバル属性 | id・class・title・lang・styleなど | ||
source | picture要素・asdio要素などの候補データ | html step12 | |
src | 再生させる動画・音声データのURL | ||
srcset | 環境に合わせた候補画像のURL | ||
sizes | 条件ごとの表示幅 | ||
media | メディアクリエで示す条件 | ||
type | データのMIMEタイプ | ||
グローバル属性 | id・class・title・lang・styleなど | ||
span | 特定の意味を持たないインライン要素 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
strong | 重要な部分 | html step10 | |
グローバル属性 | id・class・title・lang・styleなど | ||
style | スタイルシート | ||
media | メディアクエリ | ||
type | スタイルシート言語を表すMIMEタイプ | ||
nonce | CSPのノンス | ||
グローバル属性 | id・class・title・lang・styleなど | ||
sub | 下付き文字 | html step9 | |
グローバル属性 | id・class・title・lang・styleなど | ||
summary | 詳細情報の見出し | ||
グローバル属性 | id・class・title・lang・styleなど | ||
sup | 上付き文字 | html step9 | |
グローバル属性 | id・class・title・lang・styleなど | ||
table | 表全体 | html step15 | |
border | レイアウト用の表ではない事を明示する | ||
グローバル属性 | id・class・title・lang・styleなど | ||
tbody | 表の本体 | html step16 | |
グローバル属性 | id・class・title・lang・styleなど | ||
td | 表のセル(データ) | html step15 | |
colspan | セル何個分の幅を持たせるか | ||
rowspan | セル何個分の高さを持たせるか | ||
headers | このセルの見出しとなっているth要素をidで示す | ||
グローバル属性 | id・class・title・lang・styleなど | ||
template | 内容をスクリプトで挿入する範囲 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
textarea | 複数行の入力フィールド | html step19 | |
cols | 入力フィールドの幅を文字数で指定 | ||
rows | 入力フィールドの高さを文字数で指定 | ||
name | データとセットになって送信される項目名 | ||
disabled | 入力フィールドを無効にする | ||
readonly | 入力フィールドを変更不可にする | ||
wrap | 行を折り返している箇所に改行を加えるかどうか | ||
requied | 入力を必須にする | ||
autofocus | ロードされると同時にこの部分にフォーカスさせる | ||
placeholder | プレースホルダ― | ||
autocomplete | オートコンプリートの設定 | ||
inputmode | 入力モード(全角ひらがななど) | ||
minlength | 最低限入力しなければならない文字数 | ||
maxlength | 入力可能な最大の文字数 | ||
dirname | 文字表記の方向を自動的に送信させる際の項目名 | ||
form | この入力フィールドと関連付けるフォームのid | ||
グローバル属性 | id・class・title・lang・styleなど | ||
tfoot | 表のフッタ― | html step16 | |
グローバル属性 | id・class・title・lang・styleなど | ||
th | 表のセル(見出し) | html step15 | |
colspan | セル何個分の幅を持たせるか | ||
rowspan | セル何個分の高さを持たせるか | ||
headers | このセルの見出しとなっているth要素をidで示す | ||
scope | 見出しの対象となっているデータセルの範囲 | ||
abbr | 見出しを簡略化したもの | ||
グローバル属性 | id・class・title・lang・styleなど | ||
thead | 表のヘッダー | html step16 | |
グローバル属性 | id・class・title・lang・styleなど | ||
time | 機械可読可能な日時のデータ | ||
datetime | 要素内容を機械可読形式にしたデータ | ||
グローバル属性 | id・class・title・lang・styleなど | ||
title | ページのタイトル | html step4 | |
グローバル属性 | id・class・title・lang・styleなど | ||
tr | 表の横一列 | html step15 | |
グローバル属性 | id・class・title・lang・styleなど | ||
track | audio要素・video要素のテキスト・トラック | ||
kind | テキスト・トラックの種類 | ||
src | テキスト・トラックのURL | ||
srclang | テキスト・トラックの言語の種類 | ||
label | テキスト・トラックのタイトル | ||
default | このトラックをデフォルトにすることを示す | ||
グローバル属性 | id・class・title・lang・styleなど | ||
u | テキスト以外の注釈の付いた部分 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
ul | リスト全体 | html step7 | |
グローバル属性 | id・class・title・lang・styleなど | ||
var | 変数 | html step11 | |
グローバル属性 | id・class・title・lang・styleなど | ||
video | 動画の再生 | html step13 | |
src | 再生させる動画データのURL | ||
controls | コントローラーを表示させる | ||
sutoplay | 自動的に再生を開始させる | ||
loop | 繰り返し再生させる | ||
muted | 音量がゼロの状態にする | ||
width | 動画の幅 | ||
height | 動画の高さ | ||
poster | 再生可能となるまでの間に表示させる画像のURL | ||
preload | プリロードに関する設定 | ||
crossorigin | CORSの認証の設定 | ||
グローバル属性 | id・class・title・lang・styleなど | ||
wbr | 改行可能にする位置 | ||
グローバル属性 | id・class・title・lang・styleなど |
という事で今回は、HTML5.1各要素をABC順にてアルファベットのK~Wまでの要素を記載いたしました。
やはり、かなりのボリュームですので要素(タグ)や属性をしっかりと覚える必要はなく、理解する必要がある事と思います。実際にコーディングやマークアップをおこなう際は、上記などを見ながら記載すると、適切に記載することが比較的簡単に出来ることと思います。
また、次回は補足といたしまして、各要素(タグ)の配置ルールを一覧にて記載しようと思います。コレもあると非常に便利ですね。
とりあえず、今回はここまで…。
お仕事のご依頼は↓コチラより…、それではまた次回…。