HTML默认合并连续空白符是规范行为；内联元素间缝隙源于源码换行被解析为空格，可用font-size:0、flex或注释解决；文本多空格需用 等实体，布局调间距应优先用letter-spacing等CSS属性。
为什么直接敲空格没用
HTML默认会把连续空格、制表符、换行符全部合并成一个空格，这是规范行为，不是bug。你在编辑器里敲10个空格，浏览器只渲染1个；回车换行也基本被忽略——除非你用<pre class="brush:php;toolbar:false;"></pre>或white-space干预。
内联元素之间有奇怪的缝隙怎么办
这是最常被误认为“空格问题”的实际布局干扰：当<span></span>、<a></a>等内联元素写在不同行时，HTML源码里的换行符会被解析为一个空格字符，再结合当前font-size，最终渲染出约font-size / 3宽的间隙（比如font-size: 16px时约5–6px）。
解决它不靠删空格，而靠控制渲染逻辑：
- 父容器设
font-size: 0，子元素再单独设font-size（注意继承影响） - 改用
display: flex，天然无视源码空白，再配gap精确控距 - 把所有内联元素写在同一行（牺牲可读性，不推荐）
- 用注释
<!-- -->挤掉换行，如<span>A</span><!-- --><span>B</span>
想让文本里多个空格原样显示
别用普通空格键，用HTML实体：
立即学习“前端免费学习笔记（深入）”；
-
-
-
-
注意： 末尾的分号;不能省，否则无效；这些实体只作用于文本内容，不影响布局结构。
需要整体拉大/压缩文字间距
用CSS而非空格实体更可控：
-
letter-spacing：调单个字符间距离，对中英文都生效，支持负值（慎用，易重叠） -
word-spacing：只影响单词之间（以空格分隔的单元），对中文几乎无感 -
white-space: pre-wrap：配合<div>使用，既保留换行和空格，又允许自动折行<p>真正难处理的是混合场景：比如一段含<code>的中文标题，又套了letter-spacing——这时实体空格的宽度会叠加CSS间距，容易失控。优先选一种方式，别叠用。
