37

当文本达到#div.

我怎样才能做到这一点?因为,如果我尝试输出 200 个字符且没有空格的数据,我会得到以下信息:

结果 1(无间距):

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...

结果2(有一个空格):

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa (space)
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...

预期结果

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...

我需要使用以下内容吗?

result+=str.substring(0,200)  "\n";

或者它是一个 CSS 样式?

4

6 回答 6

65

应用word-break: break-all;将使文本在超过其父宽度时在任何字符处换行,而无需空格或其他类型的断点。

于 2013-08-19T06:39:30.553 回答
11

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

word-break:break-all;

讨论这些的 W3 规范似乎表明 word-break: break-all 用于要求 CJK(中文、日文和韩文)文本的特定行为,而 word-wrap: break-word 是更通用的,非-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

工作示例:

Word-Break W3Schools

于 2015-06-29T18:32:46.380 回答
6

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

这是你想要的吗?

于 2013-08-19T06:35:53.093 回答
3

使用 div 并在 CSS 文件中设置 div 的宽度

    .respose container:{
width:200
}

然后在html文件中添加

<p div="response container">
if(string.length>limit)
{`return string.substring(0,limit)+'...';`
}
else
{`return string;`
}
</p>
于 2019-08-20T08:07:53.113 回答
1

word-break属性可用于控制文本流。以下值将解决您的问题: word-break: break-all

更多信息可以在这里找到:https ://developer.mozilla.org/en-US/docs/Web/CSS/word-break

于 2019-08-19T11:15:52.917 回答
1

更新后的答案应该是:

overflow-wrap:break-word;

它会破坏一个本身无法容纳在自己的行中的单词,但保留所有其他单词(请参阅此处的溢出包装)。

您还可以使用:

overflow-wrap:anywhere;但这将允许在任何单词后换行,以减少元素的宽度。请参阅以下 MDN 中描述的差异:

[break-word is] 与anywhere值相同,如果行中没有其他可接受的断点,则允许在任意点打破通常不可破坏的单词,但在计算时不考虑由单词break引入的软换行机会最小内容内在大小。

此外,anywhereInternet Explorer、Safari 和某些移动浏览器不支持,而break-word所有主要浏览器都支持(请参阅 [此处][2])。

word-break: break-word;不应再使用它,因为它已被弃用,取而代之的是overflow-wrap:break-word;. 现在,该word-break属性旨在用于当您想打断单词时,无论它们是否适合自己的行(即 OP 的第一个示例word-break: break-all.

与 word-break 相比,overflow-wrap 只会在整个单词不能放在它自己的行上而不溢出的情况下才会创建一个 break。

(来自上面也链接的溢出包装)

于 2020-09-10T18:52:28.787 回答