HTMLの基本的な構造

HTML文書の基本的な構造は、以下のようになっています。

<!DOCTYPE html>
<html>
  <head>
    <title>ページのタイトル</title>
  </head>
  <body>
     ページの内容
  </body>
</html>

<!DOCTYPE html>：HTML5であることを宣言します。
<html>：HTML文書全体を囲むタグです。
<head>：文書のメタデータを定義するタグです。
<title>：ページのタイトルを定義するタグです。
<body>：ページの本文を定義するタグです。

HTMLの基本的なタグ

以下は、HTML文書でよく使われる基本的なタグです。

<h1>～<h6>：見出しを定義するタグです。<h1>が最も大きな見出しで、<h6>が最も小さな見出しです。
<p>：段落を定義するタグです。
<a>：リンクを定義するタグです。href属性にリンク先のURLを指定します。
<img>：画像を表示するタグです。src属性に画像ファイルのURLを指定します。
<ul>、<ol>：順序なしリスト、順序ありリストを定義するタグです。<li>タグでリストのアイテムを定義します。
<table>：表を定義するタグです。<tr>タグで行、<td>タグでセルを定義します。

サンプルコード

以下は、基本的なHTML文書の例です。

<!DOCTYPE html>
<html>
  <head>
    <title>サンプルページ</title>
  </head>
  <body>
    <h1>見出し1</h1>
    <p>段落1</p>
    <h2>見出し2</h2>
    <p>段落2</p>
    <ul>
      <li>リスト1</li>
      <li>リスト2</li>
      <li>リスト3</li>
    </ul>
    <table>
      <tr>
        <td>セル1-1</td>
        <td>セル1-2</td>
      </tr>
      <tr>
        <td>セル2-1</td>
        <td>セル2-2</td>
      </tr>
    </table>
  </body>
</html>

その他のHTMLタグ

HTMLには、上記の基本的なタグ以外にも、様々なタグが存在します。以下にいくつかの例を挙げます。

<form>：フォームを定義するタグです。action属性にフォームの送信先のURLを指定します。
<input>：フォームの入力欄を定義するタグです。type属性で入力欄の種類を指定します（例：text、checkbox、radioなど）。
<select>：プルダウンメニューを定義するタグです。<option>タグで選択肢を定義します。
<textarea>：複数行のテキスト入力欄を定義するタグです。
<div>、<span>：コンテンツをグループ化するためのタグです。<div>はブロック要素、<span>はインライン要素です。

HTMLのコメント

HTMLでは、の形式でコメントを記述することができます。コメントはブラウザに表示されませんが、コードの解説やメモ書きなどに活用することができます。

まとめ

以上が、初めてのHTMLに必要な基本的な知識となります。HTMLは、ウェブページを構築する上で欠かせない要素です。これらの基本的なタグや構造を把握して、自分のページを作ってみましょう。

HTML/CSS

「HTML/CSS」の記事一覧

テスト記事8

テスト記事7

初めてのHTML：基本的なタグと使い方の解説

人気記事