HTMLでの表の作成方法

1. 基本的な表の作成: HTMLの<table>要素を使用して基本的な表を作成できます。以下は例です。

<table>
  <tr>
    <th>ヘッダー1</th>
    <th>ヘッダー2</th>
    <th>ヘッダー3</th>
  </tr>
  <tr>
    <td>セル1</td>
    <td>セル2</td>
    <td>セル3</td>
  </tr>
  <tr>
    <td>セル4</td>
    <td>セル5</td>
    <td>セル6</td>
  </tr>
</table>

2. セルの結合: HTMLの<colspan>属性と<rowspan>属性を使用して、セルを結合することができます。以下は例です。

<table>
  <tr>
    <th>ヘッダー1</th>
    <th colspan="2">ヘッダー2とヘッダー3を結合</th>
  </tr>
  <tr>
    <td rowspan="2">セル1とセル4を結合</td>
    <td>セル2</td>
    <td>セル3</td>
  </tr>
  <tr>
    <td>セル5</td>
    <td>セル6</td>
  </tr>
</table>

3. スタイル付きの表: CSSを使用して表のスタイルをカスタマイズすることもできます。以下は例です。

<style>
  table {
    border-collapse: collapse;
    width: 100%;
  }
  th, td {
    border: 1px solid black;
    padding: 8px;
    text-align: left;
  }
  th {
    background-color: #f2f2f2;
  }
</style>
<table>
  <tr>
    <th>ヘッダー1</th>
    <th>ヘッダー2</th>
    <th>ヘッダー3</th>
  </tr>
  <tr>
    <td>セル1</td>
    <td>セル2</td>
    <td>セル3</td>
  </tr>
  <tr>
    <td>セル4</td>
    <td>セル5</td>
    <td>セル6</td>
  </tr>
</table>

これらはHTMLで表を作成するための基本的な方法です。さまざまな属性やスタイルを組み合わせることで、より高度な表のレイアウトを作成することも可能です。詳細な情報については、HTMLの表に関するドキュメントやチュートリアルを参照してください。