防止文本重叠表td宽度

Question

如何限制表<td>条目在整个屏幕上展开时 条目太长？

Answer 1

那么，在CSS中有max-width,max-height和overflow。

所以

td.whatever 
{ 
    max-width: 150px; 
    max-height: 150px; 
    overflow: hidden; 
} 

将所述最大宽度和高度限制到150像素，并且它可以是由小于150的任何高达150，以及任何不符合内部将被修剪掉并隐藏从视图。

溢出的默认值（overflow: visible;）只是简单地允许任何不适合在指定容器内的东西溢出到其外部。如果你只想水平限制它，不想隐瞒什么，word-wrap可以帮助：

td.whatever 
{ 
    max-width: 150px; 
    word-wrap: break-word; 
} 

word-wrap会打破的话，只要它需要，即使它不是在一个单词的结尾。如果您不希望表格展开或缩小，您也可以使用height和width来指定固定大小。

Answer 2

您可以使用word-wrap:break-word;，这样过长的词语就会被打包。

Answer 3

td.whatever_class{ 
    max-width: 100px; 
} 

用你想要的宽度替换100px。 1000px对于网站来说是一个很好的宽度，因为它几乎适用于所有人今天所有的显示器，所以如果你有20列，那么就是50px。

Answer 4

您需要指定max-width和display样式（因为display属性设置为有趣，因为它是td，而不是普通元素），例如

td{ 
    max-width: 100px; 
    display: inline-block; 
} 

Answer 5

还有一个很好的解决方案，最大宽度：0px;所以它将负责整个表格的宽度。