联调时候,浏览器将多个空格合并为一个空格了。
这是因为我们在编写HTML的时候,会有一个默认属性:white-space:normal;
white-space:normal;在CSS中表示,合并空白字符,允许自动换行。
同样的white-space还有其他几个属性:
nowrap:表示合并空白字符,不允许换行
pre-line:合并空白字符(不包括换行符),允许自动换行
pre:不合并空白字符,不允许自动换行
pre-wrap:不合并空白字符,允许自动换行
解决方法
- 使用CSS属性white-space:pre;
这个方法可能破坏原有的样式,不建议使用
- 使用语义化标签<pre></pre>
这种方法会将输入的字符原样展示,目前没有见到破坏CSS样式