よく使われるHTMLタグを簡単にまとめました。
テキスト編
文章などテキストによく使われるHTMLタグを紹介します。
| タグ | 説明 | 主な特徴 |
| h1 | 見出し（h1~h6まである） | ブロックレベル |
| p | 段落。本文を書く時に使用 | ブロックレベル |
| a | リンクの設置 | インライン |
| strong | 重要な文字 | インライン |
| span | 特定の範囲をグループ化 | インライン |
| br | 改行 | インライン (空要素) |
| small | 細目(コピーライトなど)に使用 | インライン |
| mark | テキストをハイライト表示 | インライン |
詳細は以下を見てください。
埋め込み編
画像や動画、マップを表示する時によく使うHTMLタグを紹介します。
| タグ | 説明 | 主な特徴 |
| img | 画像の表示 | インライン (空要素) |
| embed | プラグインの動画やマップを埋め込み | Youtubeの動画やGoogleマップなどが埋め込める |
| video | プラグインなしで動画を表示 | HTML5から使用可 |
| audio | プラグインなしで音声を表示 | HTML5から使用可 |
テーブル編
表を作る時によく使うタグを紹介します。
| タグ | 説明 | 主な特徴 |
| table | 表 | |
| tr | 表の行 | |
| th | 見出しのセル | 太字、中央揃い |
| td | データセル |
リスト編
リストを作る時によく使うタグを紹介します。
| タグ | 説明 | 主な特徴 |
| ul | リスト | 箇条書きやメニュー、ナビなどに使うことが多い |
| li | リストの項目 | 箇条書きやメニュー、ナビなどに使うことが多い |
| dl | 説明リスト | ある標題とその標題の説明に使うことが多い |
| dt | 説明リストの標題 | ある標題とその標題の説明に使うことが多い |
| dd | 標題についての説明 | ある標題とその標題の説明に使うことが多い |
グループ編
グループ化する時によく使うHTMLタグを紹介します。
| タグ | 説明 | 主な特徴 |
| div | コンテンツをグループ化 | classやidと組み合わせて使うことが多い |
セクション編
コンテンツの区切りとしてよく使うHTMLタグ
| タグ | 説明 | 主な特徴 |
| body | 文書本体を表す | ブラウザに表示される部分 |
| header | ヘッダーを表す | サイトロゴ、グロナビなどページの共通部分に使用 |
| nav | ナビゲーションを表す | グロナビやページ内リンクのナビに使用 |
| main | 文書のメインコンテンツを表すタグ | 共通使用されるロゴ、グロナビなどには使用しない |
| footer | フッターを表す | コピーライトなどのサイト最下部の共通部分に使用 |
| article | 自己完結したセクションを表す | 本文の完結した内容を一括りにする時に使われることが多い |
| section | 一般的なセクションを表す | 本文の一区切りとして使われることが多い |
| aside | 補助的なセクションを表す | 本文とは関係ないサイドバーなどで使われる |
メタデータ編
メタデータに使われるHTMLタグを紹介します。
| タグ | 説明 | 主な特徴 |
| head | メタデータの集まりを表す | 基本的にブラウザに表示されない部分 |
| title | 文書にタイトルを表示 | 検索結果やブラウザのタブなどに表示される |
| link | 別の文書と関連付ける | 外部のCSSやJavaScriptなどを関連付ける時に使用 |
| style | スタイルシートの記述 | 文書内にスタイルシートを記述する時に使用 |
| meta | 様々なメタ情報の記述 | 様々なメタ情報を入れる時に使用 |
ルート編
文書の最上位に記述する要素です。
| タグ | 説明 | 主な特徴 |
| html | 文書の最上位に記述する要素 | DOCTYPE宣言の直後に記述します |