Html CSS还是什么?强制将文本分成多行
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18307668/
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
CSS or what? Forcing the text split into multiple lines
提问by John Bobs
Forcing the text split into multiple lines when it reaches the maximum width of the #div
.
当文本达到#div
.
How can I do this? because, if I try to output data with 200 characters without spacing, I get the following:
我怎样才能做到这一点?因为,如果我尝试输出 200 个字符而没有空格的数据,我会得到以下信息:
Result 1(no spacing):
结果 1(无间距):
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...
Result 2(have one space):
结果 2(有一个空格):
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa (space)
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...
Expected result:
预期结果:
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...
Do I need to use the following?
我需要使用以下内容吗?
result+=str.substring(0,200) "\n";
or it is a CSS styling?
或者它是一个 CSS 样式?
回答by K. V. Suresh
Applying word-break: break-all;
will make the text wrap at whatever character whenever it exceeds it's parent's width, without the need of a space or other type breakpoint.
应用word-break: break-all;
将使文本在超过其父级宽度的任何字符处换行,而无需空格或其他类型的断点。
回答by Dan Beaulieu
As already stated in the accepted answer use the following:
如已接受的答案中所述,请使用以下内容:
word-break:break-all;
The W3 specificationthat talks about these seem to suggest that word-break: break-all is for requiring a particular behaviour with CJK (Chinese, Japanese, and Korean) text, whereas word-wrap: break-word is the more general, non-CJK-aware, behaviour. (credit: AakashM: see post)
讨论这些的 W3 规范似乎表明 word-break: break-all 用于要求对 CJK(中文、日语和韩语)文本进行特定行为,而 word-wrap: break-word 是更通用的非-CJK 意识,行为。(信用:AakashM:见帖子)
Word-Break Property options(W3Schools):
断字属性选项(W3Schools):
normal Default value. Break words according to their usual rules
break-all Lines may break between any two letters
keep-all Breaks are prohibited between pairs of letters
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about
Working Example:
工作示例:
回答by Mohammad Masoudian
make a smaller div and use CSStext-align: justify
and word-break:break-all;
制作一个较小的 div 并使用CSStext-align: justify
和word-break:break-all;
回答by Shreyash Shetty
The word-break
property can be used to control the text flow. The following value would fix your issue:
word-break: break-all
该word-break
属性可用于控制文本流。以下值将解决您的问题:
word-break: break-all
More info can be found here: https://developer.mozilla.org/en-US/docs/Web/CSS/word-break
更多信息可以在这里找到:https: //developer.mozilla.org/en-US/docs/Web/CSS/word-break
回答by Shreyash Shetty
use div and set the width of a div In CSS File
使用 div 并在 CSS 文件中设置 div 的宽度
.respose container:{
width:200
}
And then in the html file add
然后在html文件中添加
<p div="response container">
if(string.length>limit)
{`return string.substring(0,limit)+'...';`
}
else
{`return string;`
}
</p>