HTMLテーブルのColspan属性の使用方法

1. 2列を結合する例:

   <table>
   <tr>
   <td colspan="2">結合されたセル</td>
   </tr>
   <tr>
   <td>セル1</td>
   <td>セル2</td>
   </tr>
   </table>

   上記のコードでは、colspan="2"がセルを2列に結合するために使用されています。結果として、1つのセルが2つの列にまたがります。

2. 3列を結合する例:

   <table>
   <tr>
   <td colspan="3">結合されたセル</td>
   </tr>
   <tr>
   <td>セル1</td>
   <td>セル2</td>
   <td>セル3</td>
   </tr>
   </table>

   上記のコードでは、colspan="3"がセルを3列に結合するために使用されています。結果として、1つのセルが3つの列にまたがります。

3. 複数の行と列を結合する例:

   <table>
   <tr>
   <td rowspan="2" colspan="2">結合されたセル</td>
   <td>セル3</td>
   </tr>
   <tr>
   <td>セル4</td>
   </tr>
   <tr>
   <td>セル5</td>
   <td>セル6</td>
   <td>セル7</td>
   </tr>
   </table>

   上記のコードでは、rowspan="2"とcolspan="2"がセルを2行と2列に結合するために使用されています。結果として、1つのセルが2行にまたがり、2列にまたがります。

これらはHTMLテーブルのColspan属性を使用するいくつかの例です。Colspan属性を活用することで、柔軟なテーブルレイアウトを作成することができます。