tr包含td与rowspan只有没有强制新行与下一个tr

Question

我正在写一个小程序与表。我发现如果tr只包含带有rowspan和colspan属性的td，那么当我添加另一个tr时，这个tr就不会在换行符中。 下面的代码：

<table> 
<tr> 
    <td colspan='6' rowspan='2'>hello</td> 
    <td colspan='6' rowspan='2'>hello</td> 
</tr> 
<tr> 
    <td>hello</td> 
</tr> 
<tr> 
    <td>hello</td> 
</tr></table> 

参考，请看到的jsfiddle链接。 http://jsfiddle.net/fvxjq1qL/ 这看起来很尴尬，我不知道如何解决这个问题。 非常感谢您的帮助。

http://jsfiddle.net/uhq7o2sw/1/这是我想要的输出（没有第二个空标签）。我写的这个小程序是用户自己在html页面上绘制一个表格的（我需要得到html格式的表格来生成pdf报告，所以用户自己绘制一张表格会很方便，我不必为他们写html来获取我需要的数据）。当我测试这个小程序时，我发现了这个错误。如果用户只想设置6个colspans和2个rowpan的tr（假设他/她想要td更高），那么下一个tr将在同一行。所以我试图找到一个解决方案来解决它，但没有运气。

Answer 1

问题是rowspan被设置为2。因此，细胞也占据了它下面的细胞空间。第二行然后在右侧开始两个位置（通过行跨越的单元格）。该单元格随后显示在表格的顶部，因为它上面没有任何单元格。这是因为没有细胞只占据第一排。它可以通过这个例子可以更清楚地表明：

table { 
 
    border-spacing: 0; 
 
    border-collapse: collapse; 
 
} 
 
td { 
 
    border: 1px solid black; 
 
}

<table> 
 
    <tr> 
 
     <td colspan='6' rowspan='2'>hello</td> 
 
     <td></td> 
 
    </tr> 
 
    <tr> 
 
     <td>hello</td> 
 
    </tr> 
 
    <tr> 
 
     <td>hello</td> 
 
    </tr> 
 
</table>