2021-07-26 white-space: pre-wrap

第二：通过直接str = str.replace(/↵/g,"< br />") 是替换不了的，
str = str .replace(/(\r\n|\n|\r)/gm , “
”); 可以直接替换，下图为展示成功

项目中遇到一个需求，用户输入内容需要保留空白符和换行符来展示。

white-space: pre-wrap

想必大家都想到了

white-space: pre-wrap
用户输入的：

image.png image.png
image.png

实际展示的：

image.png

会发现第一行，没有空格咋还首行缩进了？此时设置text-indent:0 也没用

网上一查，试试<pre>标签，保留原格式

image.png

还是不行，搜到了一个不太起眼的文章：如何让<pre></pre>里面的内容首行不缩进?-CSDN论坛

意思是标签和内容间不能有回车，尝试修改了下

image.png
image.png

心中一万个xx马路过

那再试回<p>标签呢