html - 如何设置表格单元格的最大高度？

Question

我有一个固定宽度和高度的表格单元格，如果文本太大，单元格大小应该保持不变，文本应该被 overflow:hidden 隐藏。

div {
   display: table-cell
   height: 100px;
   width: 100px;
   overflow: hidden;
   vertical-align: middle;
}

但是，如果添加的文本过多，表格单元格会扩展到 100 像素以上。有什么技巧可以防止它膨胀吗？

文本长度应为几行，因此“white-space:nowrap”解决方案不适用

Answer 1

通过 CSS 2.1 rules ，表格单元格的高度是“内容所需的最小高度”。因此，您需要使用内部标记间接限制高度，通常是 div元素 ( <td><div>content</div></td> ), 并设置 height和 overflow div 上的属性元素(当然，没有设置 display: table-cell，因为这会使其高度遵守 CSS 2.1 表格单元格规则)。