html - 表格列的最大宽度

Question

我试图为表格中的一列设置最大宽度（也就是说，我希望该列中的所有单元格都具有相同的最大宽度），但是我最初的尝试失败了：

<table border="1">
    <tr><td style="max-width:100px">a bunch of text here, it should get wrapped</td></tr>
    <tr><td>a bunch of text here, it should get wrapped</td></tr>
</table>

（也在http://jsfiddle.net/Le6H6/4/）

我期望为一个单元格设置最大宽度应该自动为同一列中的所有单元格设置它。但不知何故，第二行中的单元格超过了我设置的最大宽度，两个单元格现在都比那个宽度更宽。

我有两个问题：

1. 为什么会这样？
2. 我知道在该列中的每个单元格上设置最大宽度（单独或通过适当的 CSS 规则）将实现我想要的。但是还有一种方法可以设置列的最大宽度而不为每个单元格设置它吗？

Answer 1

1) 发生这种情况是因为这就是 HTML 表格的工作方式。表格重新调整最大单元格宽度。如果您考虑一下，这在逻辑上是有道理的。

2) 有一些方法可以解决这个问题，但没有什么适合您将单个样式添加到单个单元格的约束。

抱歉，如果这不是您要找的答案。：/

Answer 2

你不能这样做，因为max-width可以应用于单个单元格。所以你可以<div>专门为那个细胞做这件事，或者为<table>

尝试这个 ：

<table border="1" style="max-width:100px;">
    <tr>
        <td>a bunch of text here, it should get wrapped</td>
    </tr>
    <tr>
        <td>a bunch of text here, it should get wrapped</td>
    </tr>
</table>

要么使用 css

tr td { max-with :100px; }