html默认折叠连续空白字符，刷新后空格“消失”实为解析时的正常折叠；需用 或white-space: pre-wrap等方案保留空格。
刷新后连续空格消失，是因为HTML默认折叠空白
页面刷新本身不会“清除”空格，但浏览器每次重新解析HTML时，都会严格执行空白折叠（whitespace collapsing）规则：所有连续的 以外的普通空格、制表符、换行符，一律合并为一个空格。所以你看到的“刷新后没了”，其实是代码里写的普通空格被反复折叠的结果，不是刷新导致的bug。
用 替代普通空格才能稳定保留
只有 （non-breaking space）是HTML标准中明确不参与折叠的空白字符。它在DOM中是独立文本节点，刷新、重绘、甚至JS动态插入都不会被合并。
- 写三个空格？用
-
title="a b"中的 - 避免混用：
white-space: pre-wrap 是更灵活的全局方案
如果需要保留整段文本里的空格+换行+自动折行（比如用户输入的日志、代码片段、诗歌），直接给容器加CSS比堆 更可靠：
<p style="white-space: pre-wrap"> 这里有 两个缩进 和换行</p>
-
pre-wrap保留所有空白和换行，且内容超宽时自动换行，适合大多数场景 -
pre也保留空白，但不换行，容易撑破容器造成横向滚动 - 该样式在刷新后依然生效，因为它是CSS规则，不是依赖HTML源码中的字符
别用全角空格或 / 做对齐
全角空格（` `）、 、 虽然能显示多个，但它们本质是“字符”，宽度固定且不可继承字体度量，容易在不同字体/缩放下错位。
- 用于语义性分隔（如“姓名： 张三”）可以，但别用来模拟缩进或表格对齐
- 真正需要缩进，请用
text-indent；需要间距，请用margin或padding - 用户粘贴内容时，全角空格常被编辑器自动转成普通空格，导致回退到折叠状态
和white-space可能互相干扰——比如容器设了pre-wrap，里面再塞一堆 ，空格数会翻倍。实际用时选一种主策略，别叠加工具。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
