Question

如何在相同宽度的colspan下制作列？

我在表格中有表头。

<html>
<head>
<style>td {border: solid 1px black;}</style>
</head>
<body>
<table style="width: 100%;border-collapse: collapse;">
    <tr>
        <td rowspan="2">Some header columns or even several(big or small)</td>
        <td colspan="4">pre-defined number of undercolumns</td>
    </tr>
    <tr>
        <td>1</td><td>11</td><td>111</td><td>1111</td>
    </tr>
    <tr>
        <td>data_row</td><td>4444</td><td>333</td><td>22</td><td>1</td>
    </tr>
</table>
</body>
</html>

我创建了一个jsFiddle来证明这一点。

可能列数（相同宽度）可能不同。由于存在其他列，因此将table-layout更改为fixed不是我的解决方案。由于不确定数据内容的长度，我无法使用固定宽度制作它们。我也不能用百分比宽度来做它们，因为它是所有表的百分比，而不是列组。

Answer 1

你可以试试这个：

td {
    border: solid 1px black;
    width: calc(100%/5);
}

您可以将宽度除以您想要的列数。

colspan

1 个答案: