使用html连续创建子行

Question

我想创建一个简单的 html 表，在一行中包含子行。它看起来像这样；

棘手的部分是将第 3 列分成两行 row 1 和 Row 2 。 html代码看起来如何实现这样的表格？

原文由 guagay_wk 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以使用两个 div 来模拟最后一列中的两行：

 table {
  border-collapse: collapse;
  width: 50%;
  height: 50%;
}

th, td {
    border: 1px solid black;
}

td .test {
	border-bottom: 1px solid black;
}

 <table>
    <tr id="row1">
        <td>a
        </td>
        <td>b
        </td>
        <td>
        	<div class="test">Test</div>
            <div>Test</div>
        </td>
    </tr>
</table>

原文由 Yaser 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

使用行跨度

<table border=1>
    <tr><td rowspan=2>1</td><td rowspan=2>Main</td><td>Row 1</td></tr>
    <tr><td>Row 2</td></tr>
</table>

原文由 Tater Pickens 发布，翻译遵循 CC BY-SA 3.0 许可协议