浏览器在HTML解析阶段即压缩连续空白字符为单个空格，这是规范行为而非bug；唯一例外是<pre>标签，它在解析时标记为预格式化文本，使空格、换行符等作为独立文本节点保留在DOM中。
直接说结论：别从 开始学，先搞懂浏览器为什么“吃掉”你的空格——这是所有问题的根。
为什么敲10个空格只显示1个
HTML 默认会把连续空白字符（空格、制表符、换行）压缩成单个空格，这是规范行为，不是 bug。它发生在 DOM 解析阶段，和 CSS 无关，也和字体、设备无关。
- 你在编辑器里写
This<p> hello world </p>，浏览器渲染时<p>内部那 4 个空格会被压成 1 个 - 这个压缩对所有块级/行内元素都生效，
<span>里连着敲空格也没用 - 唯一例外是
<pre>标签，它在解析时就告诉浏览器：“别动我的空格和换行”
不是“空格”，是“不换行空格”
的本质是 Unicode 字符 U+00A0，语义是“此处不允许断行 + 此处必须占位”。它不会被压缩，但也不等于你按空格键打出来的那个字符。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 用
text-indent或padding-left - 用
- 连续写
真正该优先掌握的 3 种方法
按学习优先级排序，不是按出现频率：
立即学习“前端免费学习笔记（深入）”；
-
<pre>：适合整段需保留格式的内容（如代码、诗歌），但默认等宽字体，记得加font-family: inherit;覆盖 -
white-space: pre-wrap：最平衡的选择——保留源码空格和换行，又允许自动折行，适用于富文本编辑器输出或用户评论内容 -
text-indent：专治首行缩进，值用2em比用两个
容易被忽略的一点：空格处理从来不是孤立问题。它总和字体、行高、内联元素盒模型、甚至 RTL（从右向左）文本方向耦合。先确认你要解决的是“视觉对齐”还是“语义缩进”，再选方法——否则很容易用 治标不治本。
