文本是否换行显示

 多行文本

1、white-space: pre-wrap;

保留连续的空白符。在遇到换行符或 <br> 元素时，或者根据填充行框盒子的需要换行。

2、word-break: break-word; 

• 如果单词太长而无法在当前行容纳，浏览器可以尝试在单词内部进行断行，以避免内容溢出容器。

• 这通常与 overflow: hidden; 或 overflow: auto; 一起使用，以确保长单词在溢出容器边界时能够适当地断行。

white-space: pre-line; 

合并连续的空白符合并。在遇到换行符或 <br> 元素时，或者根据填充行框盒子的需要换行。

1、white-space （ white-space-collapse 和 text-wrap 的简写）

指定了两件事：

• 空白字符是否合并，以及如何合并。
• 是否换行，以及如何换行。

2、word-break   

怎样在单词内断行

（1）normal: 使用默认的断行规则。

（2）break-all: 可换行，并且对于 non-CJK (CJK 指中文/日文/韩文) 文本，可在任意字符间断行。

（3）keep-all: CJK 文本不断行。Non-CJK 文本表现同 normal。

（4） break-word: 已弃用

他的效果是word-break: normal 和 overflow-wrap: anywhere 的合，不论 overflow-wrap的值是多少。

备注：与 word-break: break-word 和 overflow-wrap: break-word对比，

    word-break: break-word 将在文本可能溢出其容器的确切位置创建一个断点。

 单行文本

超出width以省略号显示