在HTML表格中,如何强制单元格文本截断,而不是增加单元格或包装的宽度

时间:2012-01-17 08:46:01

标签: css css-tables

我尝试了很多CSS样式设置,但似乎无法使其正常工作,我要么将文本换行,要么增加列的大小。

我尝试将表格布局设置为固定

table { table-layout:fixed; }

为该列尝试了各种不同的组合。

Name { width: 100px; overflow:hidden; white-space:nowrap; }

3 个答案:

答案 0 :(得分:2)

也可以在整个表格上设置宽度。宽度可以设置为百分比,像素或其他单位。您可能认为设置每列的宽度或第一行中每个单元格的宽度就足够了,但由于某些奇怪的原因,它没有。

表的固定布局有许多怪癖和奇怪之处,其中之一是如果内容不适合,则列会变宽,除非已设置表的总宽度。这似乎在浏览器中如此一致,甚至可能认为它是规范的一部分(但据我所知,它并非如此)。

如果你想为某些列设置固定宽度(在需要时截断)而不设置总宽度,我担心你需要像<td><div>...</div></td>那样设置宽度和溢出属性的解决方法div元素。

答案 1 :(得分:1)

这是你要找的吗?

http://jsfiddle.net/PW6Bg/

答案 2 :(得分:0)

您可以将<td>的宽度设置为固定值。

另外,请做一些研究,这个问题被多次询问:)