HTML表格 - 固定宽度列和水平滚动

Question

我需要创建一个HTML表格，其中每列的宽度都固定为200像素。如果表格超出了浏览器视口的水平宽度，则应该有水平滚动条来查看屏幕外的列。由于表格是从数据库动态生成的，因此每次列数无法预先定义，因此总表格宽度也无法定义。

简言之，我想要一种方法只设置固定的列宽，然后告诉表格如果水平空间不足则进行水平滚动。任何建议将不胜感激！

- Skoota

Answer 1

我有一个 jsFiddle 示例展示了可行的方法：jsFiddle table scrolling 表格本身无法滚动（因为它们从不溢出），但是如果您在其周围包裹一个容器，用户就可以水平（或垂直）滚动。然而：

如果您无法给表格固定宽度，它将只填充尽可能多的空间。但它不会溢出其父级元素。即使表格单元格已经给定了固定宽度。

但我猜测，如果您使用这个宽度生成这些单元格，您可以计算出表格应该具有的总宽度。使用这个值（例如1000px）创建一个溢出容器。

- Justus Romijn

---

谢谢Justin。非常好用 :) 我最终计算了从数据库中所需的列数，然后将每个列的定义固定宽度乘以该列数，以动态确定表格的总宽度。 - Skoota