在 HTML 表格中添加行跨度的简单方法答案

【问题标题】：Simple way to add rowspan in HTML table在 HTML 表格中添加行跨度的简单方法
【发布时间】：2017-07-30 05:39:44
【问题描述】：

我正在尝试生成一个具有 rowSpan 的 HTML 表（如图所示）我设法为第 1 列、第 2 列和第 3 列生成表。这是代码：

 <td rowspan="2"> a</td> 
                    <td>bb</td> 
                    <td>d</td> 
                </tr> 
                    <tr>
                        <td>c</td>
                        <td>e</td>
                    </tr>

但是当它到达第 4 列时，我不知道该怎么办。我创建了一个嵌套表，但它不能正常工作。有人知道吗？

【问题讨论】：

标签： javascript html css html-table

【解决方案1】：

我认为您正在寻找这个 - 第一列跨越 3 行，中间列仅跨越单行，而右上角的列再次跨越 2 行：

  <table border="1">
  <tr>
    <th>col 1</th>
    <th>col 2</th>
    <th>col 3</th>
    <th>col 4</th>
  </tr>
  <tr>
    <td rowspan="3">a</td>
    <td rowspan="2">b</td>
    <td rowspan="2">c</td>
    <td>f</td>
  </tr>
  <tr>
    <td>g</td>
  </tr>
  <tr>
    <td>h</td>
    <td>i</td>
    <td>j</td>
  </tr>
</table>

【讨论】：

【解决方案2】：

见https://jsfiddle.net/gpnx0nqj/

请注意，第二行只有两个单元格 (td)。

【讨论】：