第二题：解释一下 word-break、word-wrap、white-space 这三个属性

[Ray-56]

CSS 中 word-break、word-wrap、white-space 这三个属性经常会被搞混，再一次来加深记忆。

可以从这两点来解释

• 属性的作用
• 属性的值

[MMmaXingXing]

word-break

作用: 自动换行的处理方法 针对英文类单词字符 中文日文无效
属性:

• normal (浏览器默认换行方法)
• break-all(任何地方都可换行)
• keep-all(半角连接符处换行)

word-wrap

作用: 单词URL是否换行
属性:

• mormal(浏览器默认 只在允许的断字点换行)
• break-word(在长单词或url内部换行)

white-space

作用: 段落中文本的显示格式
属性:

• normal(空白 会被浏览器忽略)
• nowrap(强制不换行)
• pre-line(合并空白符 保留换行)
• pre-wrap(保留空白符 正常换行(实测换行))
• pre(按照书写的正常输出 保留换行 类似<pre/>标签)
• inherit(继承父元素)

[GenXiaoLe]

• word-break
  作用: 主要是用来控制如何在盒子中将单词断句。
  属性: normal 使用浏览器默认的断句规则；break-all 允许在单词内换行；keep-all 允许在半角字符和连字符处换行。
• word-wrap
  作用: 主要是表明是否要在盒子中将单词断句。
  属性: normal 只允许在断点字换行； break-word 在长单词或者url地址内部换行。
• white-space
  作用: 主要用来控制空白符。
  属性: normal 空白符会被忽略；pre 空白会被浏览器保留；nowrap 文本不会换行，直到遇到br标签为止；pre-wrap 保留空白符序列，但是会正常换行；pre-line 合并空白符，但是会保留换行符；inherit 从符元素继承 white-space 的值。