概要
HTMLを学び始めた方向けに、よく使われるHTMLタグを一覧表でまとめました。
「このタグは何をするもの？」がすぐにわかるよう、シンプルに整理しています。
基本構造タグ
| タグ |
意味 |
<html> |
HTML文書全体を囲む |
<head> |
ページ情報（メタデータ）を含む |
<body> |
実際に表示される内容を含む |
<title> |
ページのタイトル（ブラウザのタブに表示） |
見出し・段落タグ
| タグ |
意味 |
<h1> |
一番大きな見出し |
<h2> |
二番目に大きな見出し |
<h3> |
三番目に大きな見出し |
<h4> |
四番目に大きな見出し |
<h5> |
五番目に大きな見出し |
<h6> |
一番小さな見出し |
<p> |
段落（文章のかたまり） |
テキスト装飾タグ
| タグ |
意味 |
<strong> |
重要なテキスト（太字） |
<em> |
強調したいテキスト（斜体） |
<br> |
改行 |
<hr> |
水平線（区切り線） |
リンク・画像タグ
| タグ |
意味 |
<a> |
リンク |
<img> |
画像を表示 |
リスト（箇条書き）タグ
| タグ |
意味 |
<ul> |
順序なしリスト（●つきリスト） |
<ol> |
順序ありリスト（1,2,3つきリスト） |
<li> |
リストの各項目 |
表（テーブル）タグ
| タグ |
意味 |
<table> |
表全体を囲む |
<tr> |
表の行 |
<td> |
表のセル（データ） |
<th> |
表の見出しセル |
レイアウト・グループ化タグ
| タグ |
意味 |
<div> |
汎用的なコンテナ（ブロック要素） |
<span> |
汎用的なコンテナ（インライン要素） |
<header> |
ヘッダー部分 |
<main> |
メインコンテンツ |
<footer> |
フッター部分 |
<nav> |
ナビゲーション |
<section> |
セクション（内容の区切り） |
<article> |
独立した記事・コンテンツ |
フォーム関連タグ
| タグ |
意味 |
<form> |
フォーム全体を囲む |
<input> |
入力欄 |
<textarea> |
複数行の入力欄 |
<button> |
ボタン |
<label> |
入力項目のラベル |
補足：知っておきたい基礎知識
ブロック要素とインライン要素の違い
| 要素タイプ |
特徴 |
例 |
| ブロック要素 |
横幅いっぱいに広がる・新しい行から始まる |
<div>, <p>, <h1>
|
| インライン要素 |
必要分だけの幅・他の要素と横並び |
<span>, <a>, <strong>
|
ナビゲーションとは？
サイト内の他のページへのリンク集のこと。サイトの上部メニューやサイドバーによく使われます。
<nav>
<ul>
<li><a href="/">ホーム</a></li>
<li><a href="/about">会社概要</a></li>
</ul>
</nav>
まとめ
ふと忘れてしまいがちなHTMLタグの備忘としてご活用ください😊
