You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

请求协助创建指定HTML合并行表格(附参考图)

合并行HTML表格实现代码

针对你需要的跨行合并表格,直接使用HTML的rowspan属性就能实现,以下是对应示例代码(可根据实际内容修改):

<!-- 带跨行合并的表格 -->
<table border="1" cellpadding="6" cellspacing="0" style="border-collapse: collapse;">
  <tr>
    <th>主分类</th>
    <th>子分类</th>
    <th>内容</th>
  </tr>
  <!-- 第一组:主分类跨3行 -->
  <tr>
    <td rowspan="3">分类A</td>
    <td>子项A1</td>
    <td>内容A1</td>
  </tr>
  <tr>
    <td>子项A2</td>
    <td>内容A2</td>
  </tr>
  <tr>
    <td>子项A3</td>
    <td>内容A3</td>
  </tr>
  <!-- 第二组:主分类跨2行 -->
  <tr>
    <td rowspan="2">分类B</td>
    <td>子项B1</td>
    <td>内容B1</td>
  </tr>
  <tr>
    <td>子项B2</td>
    <td>内容B2</td>
  </tr>
</table>

核心要点:

  • rowspan="数值":定义单元格跨越的行数,比如rowspan="3"代表该单元格占据3行空间
  • 被合并的行中,对应列无需再添加<td>标签,否则表格结构会出错
  • 通过border-collapse: collapse;可以让表格边框合并成单一线条,更美观

内容的提问来源于stack exchange,提问作者shangs1337

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.08 20:10:48