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

Question

我得到了一个具有固定宽度和高度的表格单元，并且如果文本太大，单元格大小应保持不变，并且文本应通过overflow：hidden隐藏。

div {

   display: table-cell

   height: 100px;

   width: 100px;

   overflow: hidden;

   vertical-align: middle;

}

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

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

Answer 1

根据CSS 2.1规则，表格单元格的高度为“内容所需的最小高度”。因此，您需要使用内部标记（通常是div元素（<td><div>content</div></td>））和元素上的set height和overflow属性间接限制高度div（display: table-cell当然，不对其进行设置，因为它的高度将遵循CSS 2.1表格单元格规则）。

Answer 2

您可以执行以下任一操作：使用css属性“ line-height”并针对每个表格行（）进行设置，这还将使内容垂直居中将“ display” css属性设置为“ block”，如下所示：td&nbsp;{&nbsp; display: block;&nbsp; overflow-y: hidden;&nbsp; max-height: 20px;}祝好运！