2020.11.04 2022.10.12

主要HTMLタグまとめ（聞き流し学習BGM付き）

この記事の動画版はこちら（画像クリックでYoutubeに飛びます）

チャンネル登録お願いします！

タグ	読み方	用途
<!DOCTYPE>	ドックタイプ	HTMLのバージョンを指定する。
<html>	エイチティーエムエル	HTMLページ全体を表す、最上位階層のタグです。
<head>	ヘッド	ページ全体に関する設定情報を記述する。
<meta>	メタ	headタグ内に記述し、ページの各種設定内容を指定する。
<title>	タイトル	headタグ内に記述し、ページのタイトルを指定する。
<link>	リンク	headタグ内に記述し、スタイルシートなどの外部リソースを参照する。
<base>	ベース	headタグ内に記述し、基準となるベースURLを指定する。
<style>	スタイル	スタイルを指定する。
<body>	ボディ	実際にブラウザの画面上に表示されるページコンテンツを記述する。
<script>	スクリプト	スクリプトを記述する。
<noscript>	ノースクリプト	scriptタグに対応していないブラウザに対する代替メッセージを記述する。
<!--　-->	コメント	HTMLソース上にコメントを記述する。
<main>	メイン	ページ内にメインコンテンツエリアを設置する。
<section>	セクション	ページ内にセクションエリアを設置する。
<header>	ヘッダー	セクションのヘッダーエリアを設置する。
<footer>	フッター	セクションのフッターエリアを設置する。
<nav>	ナブ	ページ内にナビゲーションエリアを設置する。
<div>	ディブ	ページ内に汎用的なブロックエリアを設置する。
<span>	スパン	ページ内に汎用的なインラインエリアを設置する。
<canvas>	キャンバス	ページ内に図形を描画するキャンバスエリアを設置する。
<p>	ピー／パラグラフ	段落を設置する。
<a>	エー／アンカー	リンクを設置する。
<img>	イメージ	画像を設置する。
<br>	ビーアール／ブレイク	改行を設置する。
<h>	エイチ	見出しを設置する。h1～h6の6段階で指定できます。
<hgroup>	エイチグループ	複数の見出しタグをグルーピングする。
<hr>	エイチアール	水平罫線を設置する。
<pre>	プレ	整形済みテキストを設置する。
<audio>	オーディオ	オーディオファイルを設置する。
<video>	ビデオ	ビデオファイルを設置する。
<picture>	ピクチャー	レスポンシブイメージを設置する。
<source>	ソース	videoタグ、audioタグ、pictureタグにて複数ソースを指定する場合に使います。
<track>	トラック	videoタグ、audioタグにてトラック情報を指定する。
<embed>	エンベッド	プラグインを必要とする音声や動画などを設置する。
<object>	オブジェクト	様々な形式のデータを埋め込むための汎用的なタグです。
<param>	パラメータ	objectタグに渡すパラメーターを指定する。
<iframe>	アイフレーム	ページ内に別のページを埋め込む。
<figure>	フィギュア	写真や図表のエリアを設置する。
<figcaption>	フィギュアキャプション	figureタグ内に設置され、figureのキャプションを設置する。
<article>	アーティクル	記事コンテンツを設置する。
<aside>	アサイド	補足情報を設置する。
<details>	ディテールズ	初期状態では折りたたまれている詳細エリアを設置する。
<summary>	サマリー	detailsタグ内に設置され、初期状態で表示されるサマリーを設置する。
<dialog>	ダイアログ	ダイアログを設置する。
<template>	テンプレート	スクリプトで使用するテンプレートを定義する。
<slot>	スロット	テンプレート内にスロット（枠）を定義する。
<data>	データ	コンピューターが判読可能なデータを指定する。
<meter>	メーター	メーターを表示する。
<output>	アウトプット	計算結果を表示する。
<progress>	プログレス	プログレスバーを表示する。
<time>	タイム	日時を表示する。
<map>	マップ	画像にクリッカブルマップを設置する。
<area>	エリア	クリッカブルマップ内の1つ1つのエリアを定義する。
<ol>	オーエル／オーダードリスト	順序付きのリストを設置する。
<ul>	ユーエル／アンオーダードリスト	順序無しのリストを設置する。
<menu>	メニュー	メニューリストを設置する。
<li>	エルアイ／リスト	olタグ、ulタグ、menuタグ内に設置され、1つ1つのアイテムを設置する。
<dl>	ディーエル	定義リストを設置する。
<dt>	ディーティー	dlタグ内に設置され、定義用語を設置する。
<dd>	ディーディー	dlタグ内に設置され、定義用語の説明を設置する。
<table>	テーブル	表を設置する。
<caption>	キャプション	tableタグ内に設置され、表のキャプションを設置する。
<thead>	ティーヘッド	tableタグ内に設置され、表のヘッダ行を設置する。
<tbody>	ティーボディ	tableタグ内に設置され、表のボディ行を設置する。
<tfoot>	ティーフット	tableタグ内に設置され、表のフッタ行を設置する。
<th>	ティーエイチ	tableタグ内に設置され、表の見出しセルを設置する。
<tr>	ティーアール	tableタグ内に設置され、表の行を設置する。
<td>	ティーディー	tableタグ内に設置され、表のセルを設置する。
<colgroup>	カラムグループ	tableタグ内に設置され、表の列をグループ化する。
<col>	カラム	colgroupタグ内に設置され、グループ化の指定をより細かく行う。
<form>	フォーム	入力フォームを設置する。
<fieldset>	フィールドセット	入力項目をグループ化する。
<legend>	レジェンド	フィールドセットにタイトルを設置する。
<input>	インプット	入力項目を設置する。
<label>	ラベル	入力項目にラベルを設置する。
<textarea>	テキストエリア	複数行のテキスト入力項目を設置する。
<select>	セレクト	プルダウンリストを設置する。
<datalist>	データリスト	入力項目付きプルダウンリストを設置する。
<optgroup>	オプトグループ	プルダウンリストの選択肢をグループ化する。
<option>	オプション	プルダウンリストの選択肢を設置する。
<button>	ボタン	ボタンを設置する。
<em>	エム／エンファシス	囲んだテキストを強調する。テキストは斜体で表示されます。
<strong>	ストロング	囲んだテキストを重要表記する。テキストは太字で表示されます。
<b>	ビー／ボールド	囲んだテキストを重要表記する。テキストは太字で表示されます。
<i>	アイ／イタリック	囲んだテキストが他とは性質が異なることを示す。テキストは斜体で表示されます。
<u>	ユー／アンダーライン	囲んだテキストが本来とは異なった表記になっていることを示す。テキストは下線付きで表示されます。
<small>	スモール	囲んだテキストが注釈的なものであることを示す。テキストは小さく表示されます。
<ins>	インサート	囲んだテキストが後から挿入されたものであることを示す。
<del>	デリート	囲んだテキストが削除されたものであることを示す。
<s>	エス／ストライク	囲んだテキストが正確ではないものであることを示す。
<dfn>	ディフィニション	囲んだテキストが定義された用語であることを示す。
<abbr>	アバー	囲んだテキストが略語であることを示す。
<cite>	サイト	囲んだテキストが参照であることを示す。
<address>	アドレス	囲んだテキストが連絡先であることを示す。
<blockquote>	ブロッククォート	囲んだテキストが長い引用文であることを示す。ブロック要素として設置されます。
<q>	キュー／クォート	囲んだテキストが短い引用文であることを示す。インライン要素として設置されます。
<code>	コード	囲んだテキストがソースコードであることを示す。
<samp>	サンプル	囲んだテキストがプログラムから出力されたサンプルであることを示す。
<var>	バー	囲んだテキストがプログラムの変数であることを示す。
<kbd>	キーボード	囲んだテキストがキーボードから入力されるものであることを示す。
<mark>	マーク	文章の中でハイライトしたい箇所を指定する。
<sup>	スーパースクリプト	上付き（うえつき）の文字で表示させる。
<sub>	サブスクリプト	下付き（したつき）の文字で表示させる。
<ruby>	ルビ	指定したテキストにルビを振る。
<rt>	アールティー／ルビテキスト	rubyタグ内に設置され、ルビを設置する。
<rp>	アールピー／ルビパレンセシス	rubyタグ内に設置され、ルビ未対応ブラウザのための接続文字を設置する。
<bdi>	ビーディーアイ	書字方向が異なる場合も、固定表記にしたいテキストを指定する。
<wbr>	ワードブレイク	文章の中で改行可能な位置を指定する。