HTML默认合并连续空格，可用 实体、white-space CSS属性或 / /等排版空格实现精准控制，各适用于不同场景。
HTML默认会合并连续空格
HTML解析器天生会把多个连续空格、制表符、换行符压缩成一个空格，这是规范行为，不是bug。所以直接写 或敲三下空格键，在页面上都只显示一个空格。
用 实体逐个替换空格
最直接的办法是用 （non-breaking space）代替普通空格。它不会被合并，也不会换行。
例如想显示“a b”（中间两个空格），得写：a b。注意： 不支持缩写，不能写成 s;或  （带空格）——后者会被当成普通空格处理。
适用场景：少量、固定位置的空格控制，比如对齐表单标签、补位文字间距。
立即学习“前端免费学习笔记（深入）”；
用white-space CSS属性批量控制
更灵活的方式是用CSS的white-space属性改变元素内空白符的渲染规则：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
-
white-space: pre—— 保留所有空白符和换行，但不自动换行（类似<pre class="brush:php;toolbar:false;"></pre>） -
white-space: pre-wrap—— 保留空白符和换行，且允许自动换行（最常用） -
white-space: pre-line—— 合并连续空格，但保留换行
示例：<div style="white-space: pre-wrap">hello world</div> 会原样显示4个空格。
注意：该样式会影响整个元素内的所有空白行为，包括换行符；如果容器宽度受限，pre可能造成横向溢出，pre-wrap更安全。
用 、 等排版空格实体
需要语义化或固定宽度空格时，可用这些HTML字符实体：
-
-
-
它们不受white-space影响，也不依赖字体，但属于“字符”，会被当作内容参与选中、复制、屏幕阅读器朗读——这点常被忽略。
比如写姓名： 张三，比硬塞 更语义清晰，也更容易维护。
真正麻烦的是混合场景：既要保留缩进又要响应式换行，这时pre-wrap + text-indent或margin-left往往比堆砌 更可控。
