HTMLで複数の見出しを持つテーブルを作成する方法

1. HTMLテーブルの基本構造を作成します。以下はテーブルの最も基本的な形式です。

<table>
  <thead>
    <tr>
      <th>見出し1</th>
      <th>見出し2</th>
      <th>見出し3</th>
    </tr>
  </thead>
  <tbody>
    <!-- データ行をここに追加 -->
  </tbody>
</table>

2. <thead>要素内に見出し行を追加します。各見出しは<th>要素で表現されます。

<thead>
  <tr>
    <th>見出し1</th>
    <th>見出し2</th>
    <th>見出し3</th>
  </tr>
</thead>

3. <tbody>要素内にデータ行を追加します。各データ行は<tr>要素で表現されます。セルの内容は<td>要素で定義します。

<tbody>
  <tr>
    <td>データ1</td>
    <td>データ2</td>
    <td>データ3</td>
  </tr>
  <tr>
    <td>データ4</td>
    <td>データ5</td>
    <td>データ6</td>
  </tr>
  <!-- 追加のデータ行をここに繰り返し追加 -->
</tbody>

4. 必要に応じて、テーブルにスタイルを追加します。CSSを使用してテーブルの外観をカスタマイズすることができます。

<style>
  table {
    border-collapse: collapse;
    width: 100%;
  }
  th, td {
    border: 1px solid black;
    padding: 8px;
    text-align: left;
  }
</style>

これで、HTMLで複数の見出しを持つテーブルを作成する方法を学びました。必要に応じて、テーブルに追加の見出し行やデータ行を追加することができます。