如果长度超过表格单元格宽度，则将文本截断为最后一个单词

Question

我有固定宽度td。里面的文字不应该换到第二行。如果文本比单元格的宽度更长，则它应该切掉最后一个单词。如果它没有空间并且不能破解最后一个单词，它应该与单元格的最大宽度打破。

对于此示例https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_word-wrap，我希望单元格只包含单词 “此段落包含一个”。

我有一种感觉，它是一些组合的断字和空白：无包装，但我不能让它工作。

Answer 1

你可以设置高度吗？如果你这样做并隐藏溢出，它应该只显示你想要的。

p.test { 
 
    width: 11em; 
 
    border: 1px solid #000000; 
 
    word-wrap: break-word; 
 
    overflow: hidden; 
 
    height: 1em; 
 
}

<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

Answer 2

尝试使用 的Html

<div> 
This is my div and it has some fixed width only allow text to show in one line 
</div> 

CSS

div{ 
    width: 120px; 
    color :black; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    overflow: hidden; 
} 

Working fiddle here