HTML5是如今最常用的網頁編程語言之一,它的應用廣泛,其中包括編寫表格。下面我們將提供一個HTML5編寫表格代碼示例。
首先,我們需要使用 table 標簽創建一個表格。這里創建了一個有三行且每行有兩個單元格的表格。下面是示例代碼:
<table>
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
<tr>
<td>第三行第一列</td>
<td>第三行第二列</td>
</tr>
</table>
上述代碼將會生成以下的表格:
第一行第一列 | 第一行第二列 |
第二行第一列 | 第二行第二列 |
第三行第一列 | 第三行第二列 |
接著,我們可以使用 th 標簽來添加表格頭。下面是示例代碼:
<table>
<tr>
<th>表格頭1</th>
<th>表格頭2</th>
</tr>
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
<tr>
<td>第三行第一列</td>
<td>第三行第二列</td>
</tr>
</table>
上述示例代碼將會生成帶有表格頭的表格:
表格頭1 | 表格頭2 |
---|
第一行第一列 | 第一行第二列 |
第二行第一列 | 第二行第二列 |
第三行第一列 | 第三行第二列 |
最后,我們可以使用 colspan 和 rowspan 屬性來合并單元格。下面是示例代碼:
<table>
<tr>
<th rowspan="2">表格頭1</th>
<th colspan="2">表格頭2</th>
</tr>
<tr>
<td>第一行第二列</td>
<td>第一行第三列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td colspan="2">第二行第二列和第三列被合并了</td>
</tr>
</table>
上述示例代碼將會生成以下的表格:
表格頭1 | 表格頭2 |
---|
第一行第二列 | 第一行第三列 |
第二行第一列 | 第二行第二列和第三列被合并了 |
總之,HTML5提供了豐富的標簽和屬性來編寫表格,我們可以靈活使用這些標簽和屬性來創建我們所需要的表格。