white-space 属性会影响到浏览器对文档中空格、回车和制表符的处理效果。
通过使用该属性,可以影响浏览器处理字之间和文本行之间的空白符的方式。
white-space
normal;这个值会告诉浏览器按平常的方式去处理:即丢掉多余的空白符。如果给定这个值,换行字符(回车)会转换为空格,一行中的多个空格也会转换为一个空格。
pre;如果设置了这个值,受这个属性影响的元素中,空白符的处理方式就会不同,其行为就像 pre 元素一样;空白符不会被忽略,也不会忽略换行符。
nowrap;设置了这个值,它会防止元素中的文本换行,除非使用了一个 br 元素。在 css 中使用 nowrap 非常类似于在html 中用<td nowrap>将一个表单元格设置为不能换行,不过 white-space 值可以应用到任何元素。
pre-wrap;浏览器会对元素中的文本保留空白符,并且文本行会正常的换行。
pre-line;pre-line与pre-wrap相反,会像正常文本中一样合并空白符,但是保留换行符。
总结
下面的表格总结了 white-space 属性的行为;
| 值 | 空白符 | 换行符 | 自动换行 |
| pre-line | 合并 | 保留 | 允许 |
| normal | 合并 | 忽略 | 允许 |
| nowrap | 合并 | 忽略 | 不允许 |
| pre | 保留 | 保留 | 不允许 |
| pre-wrap | 保留 | 保留 | 允许 |