overflow:hidden，文本仍然坏了。需要在CSS3之前的所有浏览器中工作。
#1 楼
div {
white-space: nowrap;
overflow: hidden;
}
<div>test that doesn't wrap</div>
注意：这仅适用于块元素。如果您需要对表格单元格执行此操作（例如），则需要在表格单元格中放置一个div，因为表格单元格具有显示表格单元格而不是块。
从CSS3开始，此功能受支持表格单元格也是如此。
#2 楼
您可以使用CSS white-space Property实现此目的。white-space: nowrap
#3 楼
使用省略号将在最后添加...。 <style type="text/css">
div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
#4 楼
有时使用 代替空格会起作用。显然，它有缺点。评论
不幸的是，在这种情况下我无法做到
– Franky
09年2月21日在5:02
#5 楼
只需清楚一点，它就可以很好地与段落和标题等配合使用。您只需要指定display: block即可。例如： -override“>
<h5 style="display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden">
This is a really long title, but it won't exceed the parent width
</h5>
（原谅内联样式）
#6 楼
在JSX / React中，防止文本换行<div style={{ whiteSpace: "nowrap", overflow: "hidden" }}>
Text that will never wrap
</div>
评论
空格！那就是我一直在寻找的... 1,000谢谢...这是谷歌无法找到的！
– Franky
09年2月21日在5:06
还有一个专有的属性，即自动换行（IIRC）...愚蠢的IE。
–arrow
09年2月23日在13:55
还要考虑“文本溢出：省略号”。如果超出了容器宽度的范围，它将在文本的末尾添加...
–提请Landgrave
2015年5月7日20:19
我认为“这仅适用于块元素”注释是正确的。如果您在锚点，段落，标题等中尝试此操作，则此操作将无效。您需要执行类似p.oneline {white-space：nowrap;溢出：隐藏display：block;}
– Alex Angelico
17年5月11日在13:33
当心隐藏溢出；这意味着生意。
– David A. Gray
18 Mar 26 '18在4:55