HTML 講座３ HTMLでよく使う4つのタグ解説

こんにちは！今回はHTMLでよく使う基本のタグ、<p>、<a>、<h1>〜<h6>、<div>についてわかりやすく解説します。

これらは、Webページの中で文章を書く・リンクを貼る・見出しをつける・要素をグループ化するといった基本的な役割を持つタグです。

HTML 講座３ HTMLでよく使う4つのタグ解説

pタグ：文章を書くときに使う

📌 使いどころ
<p> は「paragraph（パラグラフ）」の略で、段落（文章）を書くときに使うタグです。

📖 説明
複数の文章があるときは、<p> をそれぞれ囲むときれいに表示されます。
自動的に段落ごとに改行＋余白が入ります。

💡 例：

<p>こんにちは！</p>

aタグ：リンクを貼るときに使う

📌 使いどころ
<a> は「anchor（アンカー）」の略で、他のページやサイトへリンクするためのタグです。

📖 説明
href 属性にリンク先のURLを指定します。
新しいタブで開きたいときは target="_blank" をつけます。

💡 例：

<a href="https://example.com" target="_blank">別タブで開くリンク</a>

h1〜h6タグ：見出しをつける

📌 使いどころ
<h1>〜<h6> は「heading（見出し）」の略で、文章やセクションにタイトルをつけるためのタグです。

📖 説明
数字が小さいほど重要な見出し（h1が最も重要）。
見出しはページの構造を整理するために使うもの。

💡 例：

<h1>メインタイトル</h1>
<h2>サブタイトル</h2>
<h3>小見出し</h3>

divタグ：グループ化に使う

📌 使いどころ
<div> は「division（区切り）」の略で、要素をまとめて1つのブロックにするためのタグです。

📖 説明
div 自体には意味がなく、「見た目の整理・スタイルの適用」に使われます。

💡 例：

<div>
  <h2>名前</h2>
  <p>Kota</p>
</div>

実際のページ構造の例

これらのタグを組み合わせると、こんな感じのページが作れます👇

まとめ

タグ名	役割	よく使う場面
<p>	段落（文章）を書く	本文、紹介文、説明など
<a>	リンクを貼る	他のページや外部サイトへの誘導
<h1>〜<h6>	見出しをつける	タイトル、セクションの区切り
<div>	要素をまとめる（グループ化）	レイアウト調整、CSSのスタイル適用など

これらのタグは、HTMLを学ぶ上での「土台」になりますので、積極的に覚えていきましょう！