html - 固定 HTML 表格中的列宽

Question

我有一个 HTML 表格，其中的行在 PHP 循环中添加。这是循环体的样子

<tr>
    <td style="width:220px"><?php echo $a; ?></td>
    <td style="width:150px"><?php echo $b; ?></td>
    <td style="width:70px"><?php echo $c; ?></td>
    <td style="width:70px"><?php echo $d; ?></td>
</tr>

问题是，当任意一行第二列的内容稍大时，第二列的宽度超过150px，为了补偿第一列的宽度减小。我怎样才能防止这种情况发生。我希望宽度不变，如果任何特定单元格中的内容太大而无法容纳，则应增加高度以容纳。

Answer 1

你应该试试这个 CSS 指令:

td { word-wrap: break-word; }

适用于许多浏览器(是的，包括 IE 6，甚至 IE 5.5 但不是 Fx 3.0。它只能被 Fx3.5+ 识别。也适用于 Saf、Chr 和 Op，但我不知道确切的版本这些)并且不要对其他人造成任何伤害。

如果表格的宽度仍然乱七八糟，还有:

table { table-layout: fixed; }
th, td { width: some_value; }

这将迫使浏览器使用其他表格算法，该算法不会尝试适应许多情况，包括尴尬的情况，而是坚持样式表所说的内容。