请求协助创建指定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
相关产品推荐
相关产品推荐

