CSS 如何让文本出现在下一行而不是溢出?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3587390/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 22:40:03  来源:igfitidea点击:

How can I make text appear on next line instead of overflowing?

csstextoverflow

提问by user342391

I have a fixed width div on my page that contains text. When I enter a long string of letters it overflows. I don't want to hide overflow I want to display the overflow on a new line, see below:

我的页面上有一个固定宽度的 div,其中包含文本。当我输入一长串字母时,它会溢出。我不想隐藏溢出我想在新行上显示溢出,见下文:

<div id="textbox" style="width:400px; height:200px;">
dfssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssfddddddddddddddddddddddsdffffffffffffffffsdffffffffffffffffdfssssssssssssdf
</div>

Is there anyway to disable overflow and put the overflowing text on a new line??? Twitter does something like this but I can't figure it out with CSS it's possible they are using Javascript.

无论如何要禁用溢出并将溢出的文本放在新行上???Twitter 做了这样的事情,但我无法用 CSS 弄明白,他们可能正在使用 Javascript。

Can anybody help with this??

有人可以帮忙吗??

回答by Pankaj Verma

Just add

只需添加

white-space: initial;

to the text, a line text will come automatically in the next line.

到文本,一行文本将自动出现在下一行。

回答by mikemerce

word-wrap: break-word

But it's CSS3 - http://www.css3.com/css-word-wrap/.

但它是 CSS3 - http://www.css3.com/css-word-wrap/

回答by casablanca

Try the <wbr>tag- not as elegant as the word-wrapproperty that others suggested, but it's a working solution until all major browsers (read IE) implement CSS3.

试试这个<wbr>标签——不像word-wrap其他人建议的那样优雅,但它是一个有效的解决方案,直到所有主要浏览器(阅读 IE)都实现 CSS3。

回答by Pointy

Well, you can stick one or more "soft hyphens" (&#173;) in your long unbroken strings. I doubt that old IE versions deal with that correctly, but what it's supposedto do is tell the browser about allowable word breaks that it can use if it has to.

好吧,您可以&#173;在不间断的长字符串中插入一个或多个“软连字符”( )。我怀疑旧的 IE 版本是否正确地处理了这个问题,但它应该做的是告诉浏览器允许的分词符,如果必须的话,它可以使用。

Now, how exactly would you pick where to stuff those characters? That depends on the actual string and what it means, I guess.

现在,您究竟会如何选择填充这些字符的位置?我猜这取决于实际的字符串及其含义。