HTML空格实体（如 ）是内容级占位符，用于保留不可断行空格；word-spacing是样式级属性，仅调控单词间逻辑间距。二者层级不同，混用将导致语义混乱、SEO与可访问性受损。
HTML5 中的空格（如 ）和 CSS 的 word-spacing 解决的是完全不同的问题：前者是「内容级占位符」，后者是「样式级间距调控」。混用或误替会导致布局错乱、语义丢失，甚至 SEO 和可访问性受损。
空格实体（ 等）是 HTML 内容的一部分
浏览器默认会把连续多个普通空格、制表符、换行符压缩成一个空格——这是 HTML 规范行为，不是 bug。所以当你真想“显示两个空格”，就得用不可断行空格 这类实体。
- 它出现在 DOM 中，属于文本节点内容，会被屏幕阅读器读出（比如“欢迎 光临”可能被读作“欢迎 空格 空格 光临”）
- 它不能响应字体大小缩放（固定宽度，约等于当前字体的 1em）
- 多个
姓名： 张三
- 替代方案还有
word-spacing 是纯样式控制，作用于单词间逻辑间隙
word-spacing 只影响以空白符（空格、制表、换行）分隔的「单词」之间的距离，它不改变 HTML 结构，也不新增任何字符节点。
立即学习“前端免费学习笔记（深入）”；
- 值为正时，在原有单词间距基础上**额外增加**指定长度；负值则**收缩**（慎用，可能导致文字重叠）
- 单位支持
px、em、rem，其中em相对于当前元素的font-size，更适配响应式场景 - 它对中文效果有限——因为中文没有“单词”概念（浏览器按空格切分），所以只有带空格的中文短语才生效，例如：欢 迎 光 临
- 英文或中英混排时更实用：
——注意：`world!` 和 `你好` 之间不会被加宽，因为 `!` 属于标点，不是单词分隔符Hello world! 你好 world
什么时候该用哪个？看意图和层级
判断依据很简单：你是在「写内容」，还是在「调样式」？
- 需要保留原文格式（如代码、诗歌、对齐表格中的文本）→ 用
或white-space: pre，而不是堆 - 想让按钮文字更舒展、标题单词呼吸感更强 → 用
word-spacing，别手敲十个 - 表单标签与输入框之间要留点空隙 → 优先用
margin或padding，而非在标签里塞空格实体 - 首行缩进、段落间距、字符微调 → 分别用
text-indent、line-height、letter-spacing，它们和word-spacing各司其职
最常被忽略的一点：空格实体一旦写进 HTML，就固化在源码里，后续无法用媒体查询动态调整；而 word-spacing 可以配合 @media、CSS 变量甚至 JS 实时修改——真正的「样式归样式，内容归内容」。
