CSS3 word-break 属性

word-break 属性用于指定在何处可以断开单词以适应容器的宽度。它有两个可能的值：normal 和 break-all。

• normal: 默认值。在正常的单词内部断行，不允许单词中间的断行。
• break-all: 允许在单词内部断行，即使不是在单词的边界。

语法

.element {
  word-break: value;
}

值

• normal: 默认值，不允许在单词内部断行。
• break-all: 允许在单词内部断行。

示例

// www.javascriptcn.com code example
p {
  width: 200px;
  border: 1px solid #ccc;
  word-break: normal;
}

span {
  word-break: break-all;
}

在上面的示例中，段落中的文本将在单词的边界处断行，而 <span> 元素中的文本允许在单词内部断行。

word-break 属性在处理非拉丁文本时特别有用，例如中文或日文等语言，在这些语言中单词之间没有空格，因此需要在单词内部进行断行以适应容器的宽度。