CSS还是什么?强制文本拆分为多行

Joh*_*obs 23 html css styling

当文本达到'#div'的最大宽度时,强制将文本拆分为多行.

我怎样才能做到这一点?因为,如果我尝试输出200个字符而没有间距的数据,我会得到以下结果:

result1(无间距):

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...
Run Code Online (Sandbox Code Playgroud)

result2(有一个空格):

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa (space)
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...
Run Code Online (Sandbox Code Playgroud)

我想做到:

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...
Run Code Online (Sandbox Code Playgroud)

我需要使用以下内容吗?:

 result+=str.substring(0,200)  "\n";
Run Code Online (Sandbox Code Playgroud)

或者它是一个CSS造型?

小智 46

word-break: break-all;只要超出父元素的宽度,应用将使文本换行为任何字符,而不需要空格或其他类型断点.


Moh*_*ian 5

制作较小的div并使用CSS text-align: justifyword-break:break-all;

这是你想要的吗?


Dan*_*ieu 5

如已接受的答案中所述,请使用以下内容:

word-break:break-all;
Run Code Online (Sandbox Code Playgroud)

讨论这些问题的W3规范似乎暗示了断字:all-all是为了要求CJK(中文,日文和韩文)文本具有特定的行为,而换行:断字是更通用的,非-CJK意识,行为。(提供者:AakashM请参阅帖子

Word-Break属性选项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
Run Code Online (Sandbox Code Playgroud)

工作示例:

断字W3学校