HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

【HTML入門】ページに見出しを作成する方法（h1〜h6タグの使い方）

HTMLの見出しタグとは

HTMLでは、見出しを作成するためのタグが6種類用意されています。それが h1、h2、h3、h4、h5、h6 です。これらの見出しタグ <h1>〜<h6> のいずれかを使用すると、タグごとに異なるサイズの見出しが表示されます。<h1>タグは最も重要度の高い見出しを表し、<h6>タグは最も重要度の低い見出しを表します。

見出しタグは文書の構造を明確にするために、重要な順に<h1>から<h6>へと階層的に使うのが基本です。また、SEO（検索エンジン最適化）の観点からも、ページの主題を示す<h1>は各ページに1つだけ使用するのが推奨されています。

なお、これらの見出しタグは必ず <body>…</body> タグの中に記述する必要がある点に注意してください。

【HTML入門】ページに見出しを作成する方法（h1〜h6タグの使い方）

サンプルコード

次のコードを実行すると、HTMLページにさまざまな大きさの見出しを作成できます。

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Headings</title>
   </head>

   <body>
      <h1>This is heading 1</h1>
      <h2>This is heading 2</h2>
      <h3>This is heading 3</h3>
      <h4>This is heading 4</h4>
      <h5>This is heading 5</h5>
      <h6>This is heading 6</h6>
   </body>
</html>

出力結果

コードを実行すると、<h1>から<h6>まで、サイズが段階的に小さくなる6つの見出しが表示されます。

【HTML入門】ページに見出しを作成する方法（h1〜h6タグの使い方）

  1. HTMLページで円を描く方法｜CSSのborder-radiusを使った簡単な実装例

    HTMLページ上に円を描くには、主に「SVG」「Canvas」「CSS」の3つの方法があります。中でも最も手軽なのが、CSSのborder-radiusプロパティを使う方法です。要素の幅と高さを同じ値にし、border-radiusをその半分（または50%）に設定するだけで、簡単に正円を描くことができます。CSSで円を描くサンプルコード以下のコードを実行すると、青い円が画面に表示されます。ぜひ実際に試してみてください。<!DOCTYPE html> <html>    <head>     

  2. HTMLページからリダイレクトする方法を解説！metaタグの使い方

    ページリダイレクトとは？ ページリダイレクトとは、あるURLをクリックしてページXにアクセスしたにもかかわらず、内部的に別のページYへ自動的に転送される仕組みのことです。サイトの移転やURLの変更、メンテナンス中の一時的な誘導など、さまざまな場面で活用されています。 HTMLページでリダイレクトする基本：METAタグを使う HTMLページから別のページへリダイレクトさせるには、<meta>タグを使用します。<head>内に記述したmetaタグのhttp-equiv属性でHTTPヘッダーに相当する値を指定し、content属性で転送までの待機秒数と転送先URLを設定しま