表中有一些列的百分比，其余的流体

Question

我有一张桌子，其中两列将分别收到30%的空间：

<td style="width: 30%;">

其余列应该平均分配剩余空间。我该如何做到这一点？我是否只给剩下的列width了？

Answer 1

是的，声明没有宽度可行（请参阅下面的代码段）。

<td>会自动均匀地调整宽度，除非另有声明（例如<td style="width: 30%;"></td>）

修改

当您将数据放入流体单元格时，它们将适应其中的数据大小。为了使它们保持相同的宽度并包装文本，您需要声明流体单元的宽度百分比。

由于我们已经使用前两个单元格的60％，我们剩下40％。我们需要将40除以额外单元格的数量，以获得宽度的百分比值。

感谢@Chiller指出这一点！

＆＃13;

＆＃13;

table {
  height: 500px;
  width: 100%;
}

td {
  background: red;
  /* Edit - divide number of fluid cells by 40
  (because we're using 60% with the first two)
  in this example the number is just over 13) */
  width: 13%; /* the number we calculated */
}

＆＃13;

<table>
  <tr>
    <td style="width: 30%;"></td>
    <td style="width: 30%;"></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;