letter-spacing 对中文有效且是唯一直接控制汉字间距的CSS属性，但负值需谨慎（建议≤-0.03em并配line-height≥1.6）；word-spacing对纯中文基本无效，仅对HTML中显式空格起作用；混用时效果叠加，调试应查Computed面板；单位优先选px或rem。
letter-spacing 对中文有效，但别乱设负值
letter-spacing 是唯一能直接拉开汉字间距的 CSS 属性。它对每个字符（包括中英文、数字、标点）一视同仁，在“欢迎来到首页”这种无空格中文里也能生效。
常见错误是直接套用英文经验设 letter-spacing: -2px 压缩中文——小字号下（如 font-size: 14px）极易导致笔画重叠，尤其在“口”“田”“目”类结构字上明显。实际排版中，中文负值建议不超过 -0.03em，且必须搭配足够行高（line-height: 1.6 及以上）避免上下行粘连。
注意：letter-spacing 会作用于所有子元素，如果按钮里嵌了 NEW，那段英文也会被拉宽。必要时用 span { letter-spacing: normal; } 单独重置。
word-spacing 对中文基本无效，除非你手动加空格
立即购买word-spacing 只识别原始 HTML 中的空白符（空格、制表符、换行），不是“语义上的词”。浏览器把 word-spacing。
如果你硬要让它起效，只能改 HTML 结构：
<p>立即 购买</p>
这时 word-spacing: 8px 才会在“立即”和“购买”之间插入 8px 空隙。但问题来了：
需要创建、读取、编辑或处理 Word 文档（.docx / .dotx）时使用。触发词：'Word'、'word 文档'、'.docx'、'生成报告'、'制作合同/简历/方案/说明书'、'提取 word 内容'、'在文档里查找替换'、'给文档加页眉页脚/目录/表格'。也用于把任意内容排版成一份正式的 Word 文件。不要用它处理 PDF、Excel 或无关编程任务。中文创作场景尤其适合：小说大纲稿、投稿文档、合同、简历、工作总结。
- 语义污染：HTML 里塞空格破坏可读性和 SEO
- 响应式灾难：窄屏下这个空隙可能撑破容器
- 维护成本高：所有中文词都要人工拆分，无法自动化
所以，纯中文场景下， 联系我们 Contact usword-spacing 几乎没用；混排时它只影响英文单词，比如
letter-spacing 和 word-spacing 混用时视觉效果会叠加
两者独立计算，但最终渲染效果是相加的。例如：
button { letter-spacing: 1px; word-spacing: 4px; }<button>立即 购买</button>
结果是：“立”与“即”间 +1px，“即”与空格间 +1px，空格与“购”间 +4px（word-spacing），再加“购”与“买”间 +1px —— 实际看到的“即”到“购”之间有 6px 间隙，远超预期。
调试建议：
- 打开浏览器开发者工具，切到 “Computed” 面板，查
letter-spacing和word-spacing的最终数值 - 对含空格的中文，优先用
letter-spacing统一控制，禁用word-spacing - 若必须混用，把
word-spacing设为normal或0显式归零，避免继承干扰
单位选 px 还是 em？看字体是否动态变化
letter-spacing 接受 px、em、rem 等单位，但行为差异明显：
-
px最稳定：12px 字体下设letter-spacing: 2px，永远就是 2 像素，适合按钮、标题等固定尺寸场景 -
em会随父级font-size缩放：若外层div字体从 16px 改成 20px，letter-spacing: 0.1em就从 1.6px 变成 2px —— 适合响应式正文，但需确保层级字体可控 -
rem相对根字体，比em更可预测，但老版本 IE 不支持
word-spacing 同理，但因它对中文基本无效，单位选择意义不大；真正要纠结单位的，只有 letter-spacing。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
