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>