html - 使用 HTML 表格，如何使第一列固定宽度，第二列和第三列剩余宽度各 50%

Question

所以想象我有一个 100px 宽的空间，它可以改变。我想将表格的第一列固定为 30 像素，第二列和第三列我想将剩余宽度（70 像素）各占 50%，使它们各为 35 像素。

所以当空间的宽度变为 300px 时，列宽将是 30px、135px、135px（其中 135px 是 270px 除以 2 即 50%）。

这是我的尝试，但不起作用：

<table width="100%" >
                    <tr>
                        <td width="30px"> </td>
                        <td align="center" width="25%"></td>
                        <td align="center" width="25%"></td>
                    </tr>
 </table>

我尝试过其他各种方法。

谢谢。

Answer 1

尝试这个：

<table width="100%" >
    <tr>
        <td width="30px" bgcolor="red"></td>
        <td align="center" bgcolor="blue"></td>
        <td align="center" bgcolor="green"></td>
    </tr>
</table>

小提琴

Answer 2

以 px 为单位设置表格的宽度，然后以 % 为单位设置 tds 的大小。

在此示例中，您需要 60 像素的总宽度。

<table width="60px" >
                    <tr>
                        <td width="50%"> </td>
                        <td align="center" width="25%"></td>
                        <td align="center" width="25%"></td>
                    </tr>
</table>