white-space,英语词组意思为空余空间,在计算机术语中的意思是泛空格符。white-space 属性设置如何处理元素内的空白。

取值:
normal :默认值,文本自动处理换行。假如抵达容器边界内容会转到下一行。
pre :用等宽字体显示预先格式化的文本。换行和其他空白字符都将受到保护,即按照书写内容进行输出。
nowrap:强制在同一行内显示所有文本,只到文本结束或遭遇br对象。

实例介绍:
normal:

<p>
    世界这么    大
</p>

输出:
在这里插入图片描述
多个空格符,只会显示出一个

pre:

<p style="white-space: pre;">
    世界这么    大
</p>

输出:
在这里插入图片描述
多个空格符会全部显示。

nowrap:

  <p style="white-space: nowrap;width: 100px;overflow: scroll;">
        世界这么1111111111111111111111111111111111大
   </p>

输出:
在这里插入图片描述
所有的文字都被挤在一行中,对多余的内容进行滚轮处理

Logo

云原生社区为您提供最前沿的新闻资讯和知识内容

更多推荐