简介
white-space CSS 属性是用来设置如何处理元素中的空白。
| 名称 |
内容 |
| 初始值 |
normal |
| 适用元素 |
all elements |
| 是否是继承属性 |
yes |
| 适用媒体 |
visual |
| 计算值 |
as specified |
| Animation type |
discrete |
| 正规顺序 |
the unique non-ambiguous order defined by the formal grammar |
值
- normal
连续的空白符会被合并,换行符会被当作空白符来处理。填充line盒子时,必要的话会换行。
- nowrap
和 normal 一样,连续的空白符会被合并。但文本内的换行无效。
- pre
连续的空白符会被保留。在遇到换行符或者
元素时才会换行。
- pre-wrap
连续的空白符会被保留。在遇到换行符或者
元素,或者需要为了填充line盒子时才会换行。
- pre-line
连续的空白符会被合并。在遇到换行符或者
元素,或者需要为了填充line盒子时会换行。
下面的表格总结了各种 white-sapce 值的行为:
|
换行符 |
空格和制表符 |
文字转行 |
| normal |
合并 |
合并 |
转行 |
| nowrap |
合并 |
合并 |
不转行 |
| pre |
保留 |
保留 |
不转行 |
| pre-wrap |
保留 |
保留 |
转行 |
| pre-line |
保留 |
合并 |
转行 |
示例
基础示例
code {
white-space: pre;
}
下面代码允许在<pre>中换行
pre {
word-wrap: break-word; /* IE 5.5-7 */
white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
white-space: pre-wrap; /* current browsers */
}
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。