html - テーブルのコルスパンとロースパン

Question

と に少し問題がcolspanありrowspanます。次の表を作成しようとしています:

しかし、行スパンの 2 番目のサブタイトルで立ち往生しています。

<table border="1">
      <tr>
        <th colspan="3"><h1>DIVING</h1></th>
      </tr>
      <tr>
        <td colspan="2">col 1 row 1</td>
        <td>col 1 row 1</td>
      </tr>

      <tr>
        <td>col 1 row 1</td>
        <td>col 1 row 1</td>
        <td>col 1 row 1</td>
      </tr>


</table>

<tr>問題の 2 番目のサブタイトルを付けると、2 番目<td>のサブタイトルではなく、最初のサブタイトルに従います。

Answer 1

画像から、(3 ではなく) 4 つの列があるように見えます。このようなことを試してください。

<table>
    <tr>
        <th colspan="4"><h1>DIVING</h1></th>
    </tr>
    <tr>
        <td colspan="2">col 1&2 row 2</td>
        <td colspan="2">col 3&4 row 2</td>
    </tr>
    <tr>
        <td>col 1 row 3</td>
        <td>col 2 row 3</td>
        <td>col 3 row 3</td>
        <td>col 4 row 3</td>
    </tr>
</table>

次に、3 行目を繰り返し、2 行目を最後の行としてコピーします。

http://jsfiddle.net/D9VxN/