html中直接敲空格无效，因解析器会合并连续空白并忽略首尾空格；常用但有陷阱的是 ，它强制显示不换行空格，适合防断行或占位，但影响可访问性和维护性；更推荐用css（如margin、white-space）或语义化布局替代。
HTML 里直接敲空格为什么没用
因为 HTML 解析器会把连续的空白字符（空格、换行、制表符）合并成一个普通空格，再进一步——如果这个空格在行首、行尾或纯空白块里，还会被直接忽略。所以你在代码里写 （四个空格），浏览器通常只渲染一个，甚至不渲染。
是最常用但有陷阱的空格符号
是 non-breaking space，它强制显示一个不会被折叠、也不会换行的空格。但它不是“透明”的：
- 它会让文本无法在该位置断行，可能撑破容器或导致横向滚动
- 多个
- 屏幕阅读器会把它读作“空格”，影响无障碍体验（尤其大量堆砌时）
适合场景：防止“Mr. Smith”被拆到两行，或表格中占位。
更可控的替代方案：CSS + 语义化标记
真正需要“多个空格”或“对齐控制”时， 很快会失控。优先考虑：
立即学习“前端免费学习笔记（深入）”；
- 用
margin/padding控制元素间距（比如<span style="margin-right: 20px">姓名</span>） - 用
white-space: pre / pre-wrap保留原始空格缩进（适合代码块、诗歌等） - 用
<dl> <dt></dt> <dd></dd> </dl>或 flex 布局替代“空格对齐”的 hack 写法
例如保留缩进：
<p style="white-space: pre-wrap">
第一行（前面两个空格）
第二行（前面四个空格）
</p>
其他空格字符编码（少用，但得知道什么时候不能用）
除 外，HTML 支持这些空格相关字符实体，但多数有兼容性或语义限制：
-
-
-
-
注意： 和 在旧版 Safari 和部分 Android WebView 中表现不稳定；纯 Unicode 数字字符（如 ）必须声明 <meta charset="UTF-8">，否则乱码。
真正难的不是“怎么打出空格”，而是判断这个空格到底承载的是内容逻辑（比如缩进、分隔）、视觉样式（比如按钮图标间距）还是可访问性需求（比如朗读停顿）。选错方式，后面改起来比重写还累。
