HTML表格使用rowspan合并单元格不生成额外列的实现求助

问题原因 #

• 第一行URL列单元格设置rowspan="5"后，会自动纵向占据后续4行的第三列位置
• 后续4行仍保留了URL列的<td>标签，导致每行多出1个单元格，最终出现列错位、额外列的问题

正确实现代码 #

<html>
 <body><br><br>Dear colleagues. 
    <table border=1>
        <thead>
            <tr>
                <th>Filename</th>
                <th>ID</th>
                <th>URL</th>
            </tr>
        </thead>
        <tr>
            <td>example.xml</td>
            <td>ID1234</td>
            <td rowspan="5"><a href="https://example/view/780">https://example/view/780</a></td>
        </tr>
        <tr>
            <td>example.xml</td>
            <td>ID456</td>
        </tr>
        <tr>
            <td>example.xml</td>
            <td>ID678</td>
        </tr>
        <tr>
            <td>example.xml</td>
            <td>ID891</td>
        </tr>
        <tr>
            <td>example.xml</td>
            <td>ID112</td>
        </tr>
    </table><br>Regards :)<br>
 </body>
</html>

逻辑说明 #

rowspan属性用于定义单元格纵向跨越的行数，属性值为N时，当前单元格会覆盖本行以及下方N-1行的对应列位置，被覆盖的行不需要再编写对应列的单元格标签，就能保证表格总列数和表头一致，不会出现布局错位。

内容的提问来源于stack exchange，提问作者Joana Pinto