HTML表格合并主要通过两个属性实现：

1. 合并列 —— 使用 colspan

  • colspan 属性定义单元格横向合并多少列。

示例：

<table border="1">
  <tr>
    <th colspan="2">姓名</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>李四</td>
    <td>28</td>
  </tr>
</table>

上例中，第一行的“姓名”单元格横跨了两列。

2. 合并行 —— 使用 rowspan

  • rowspan 属性定义单元格纵向合并多少行。

示例：

<table border="1">
  <tr>
    <th rowspan="2">姓名</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>28</td>
  </tr>
</table>

上例中，“姓名”单元格纵向合并了两行。

3. 综合示例 — 横纵合并同时使用

<table border="1" cellpadding="5" cellspacing="0">
  <tr>
    <th rowspan="2">姓名</th>
    <th colspan="2">成绩</th>
  </tr>
  <tr>
    <th>语文</th>
    <th>数学</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>90</td>
    <td>95</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>85</td>
    <td>88</td>
  </tr>
</table>

注意事项

  • 合并单元格时要确保行列数对齐，避免表格结构错乱。
  • 不要在同一单元格同时使用 colspan 和 rowspan 超出表格范围。

如果需要，我还可以帮你写复杂表格合并的示例或响应式表格合并方案！