在我的表格中，我将列中第一个单元格的宽度设置为 100px。
但是，当该列的某个单元格中的文本太长时，该列的宽度会变得超过100px。如何禁用此扩展？

最佳答案

我玩了一会儿，因为我很难弄清楚。

您需要设置单元格宽度(th 或 td 都有效，我都设置了)并将 table-layout 设置为 fixed。出于某种原因，单元格宽度似乎只有在设置了表格宽度时才保持固定(我认为这很愚蠢，但无论如何)。

此外，将 overflow 属性设置为 hidden 以防止任何额外的文本从表格中溢出是很有用的。

您也应该确保为 CSS 保留所有边框和大小。

好的，这就是我所拥有的:

table {
  border: 1px solid black;
  table-layout: fixed;
  width: 200px;
}

th,
td {
  border: 1px solid black;
  width: 100px;
  overflow: hidden;
}

<table>
  <tr>
    <th>header 1</th>
    <th>header 234567895678657</th>
  </tr>
  <tr>
    <td>data asdfasdfasdfasdfasdf</td>
    <td>data 2</td>
  </tr>
</table>

Here it is in JSFiddle

这家伙也有类似的问题:Table cell widths - fixing width, wrapping/truncating long words

https://stackoverflow.com/questions/4457506/