参考

https://blog.csdn.net/weixin_44368963/article/details/120054949
https://www.zhangxinxu.com/wordpress/2017/03/css-font-family-chinese-english/

pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

< pre > 标签的一个常见应用就是用来表示计算机的源代码。

我们经常会在要保持文本格式的时候使用pre标签，比如当我们要展示源代码的时候，只要放一个pre标签，然后把源代码直接复制，粘贴，然后在页面上就可以保持好格式。不会像放在其它标签里那样，把换行和空格都自动折叠了。

pre {word-wrap:break-word;white-space:pre;font-family:simsun;font-size:18px;overflow-x:scroll;word-break:break-all;
}

white-space

定义:用来设置如何处理元素中的 空白

white-space: normal;  /*连续的空白符会被合并，换行符会被当作空白符来处理。填充line盒子时，必要的话会换行。 */
white-space: nowrap;  /* 和 normal 一样，连续的空白符会被合并。但文本内的换行无效。*/
white-space: pre;  /* 连续的空白符会被保留。在遇到换行符或者<br>元素时才会换行。*/
white-space: pre-wrap; /* 连续的空白符会被保留。在遇到换行符或者<br>元素，或者需要为了填充line盒子时才会换行。*/
white-space: pre-line;  /* 连续的空白符会被合并。在遇到换行符或者<br>元素，或者需要为了填充line盒子时会换行。*/white-space: break-spaces;
/**与 pre-wrap的行为相同，除了：任何保留的空白序列总是占用空间，包括在行尾。每个保留的空格字符后都存在换行机会，包括空格字符之间。这样保留的空间占用空间而不会挂起，从而影响盒子的固有尺寸（最小内容大小和最大内容大小）。*/white-space: inherit;
white-space: initial;
white-space: unset;

word-break

定义: CSS 属性 word-break 指定了怎样在单词内断行

属性说明:

word-break: break-all /* 对于non-CJK (CJK 指中文/日文/韩文) 文本，可在任意字符间断行。*/
word-break: keep-all  /*CJK 文本不断行。 Non-CJK 文本表现同 normal。 */
word-break: break-word;  /* non-standard */ 

font-family

font-family:simsun

https://developer.mozilla.org/zh-CN/docs/Web/CSS/@font-face/font-family
https://developer.mozilla.org/zh-CN/docs/Web/CSS/@font-face