CSS 中,文字换行控制主要通过 word-wrap
, word-break
和 white-space
属性来实现。word-wrap
允许长单词或URL 自动换行,word-break
用于控制单词内部是否允许断行,white-space
则控制元素内的空白如何处理,包括换行。
word-wrap
属性:
normal
: 默认值,不换行,除非遇到预定义的断行符(如空格,标点等)。break-word
: 允许长单词或URL 在单词内部进行换行,以适应容器。
word-break
属性:
normal
: 使用浏览器默认的换行规则,一般在半角空格或连字符处换行。break-all
: 允许在单词内进行换行,不考虑英文单词的完整性。keep-all
: 只在半角空格或连字符处换行,对中文等CJK字符无效,除非有空格,否则不会换行。
white-space
属性:
normal
: 浏览器默认的空白处理规则,会合并多余空白,并根据需要换行。nowrap
: 不换行,除非遇到<br>
标签或显式换行符。pre
: 保留文本中的空白符,不进行合并,且不换行,除非遇到<br>
标签。pre-wrap
: 保留空白符,但会根据需要换行。pre-line
: 合并空白符,但保留换行符,并根据需要换行。