HTML：将表格中的两列设置为比其他列宽固定像素数

Posted 2023-03-05

【中文标题】HTML：将表格中的两列设置为比其他列宽固定像素数

【英文标题】：HTML: set two columns in table wider than others by fixed number of pixels

【发布时间】：2018-12-18 07:16:27

【问题描述】：

我有一个包含 N 列 (N >= 3) 的表，我希望列如下：

最左边（第 1）列是X 比列2, 3 ... N-1 宽的像素 最右边的 (Nth) 列是 Y 比列 2, 3 ... N-1 宽的像素 列2, 3 ... N-1 都是等宽的，当表格的容器调整大小时会发生变化。

上面的X、Y和N是页面加载前已知的固定数字（它们是常量）。

我怎样才能做到这一点（经典的 html/CSS 或 Bootstrap）？

【参考方案1】：

你可以试试这个

page.css

th
  width: N width;


th:first-child
  width: X;


th:last-child
  width: Y;

如果您的表格上没有标题，您可以将 th 更改为 td

【讨论】：

不幸的是，它似乎不起作用。它保持 X 的第一列宽度和 Y 的最后一列宽度，而不管表的总宽度如何。我想要的是，当表格变大时，第一列和最后一列确实会变大，但同时它们仍然比“内部”列分别大 X 和 Y 像素。

你会用JS吗？