code标签需显式设置letter-spacing调整字距，常见无效因字体不敏感、white-space限制、浏览器兼容性或行框挤压；中英文混排宜分设0.02em～0.05em与-0.05em；应避免继承干扰，优先用em单位并换优写字体。
code 标签默认不带字间距调整，要改必须显式加 letter-spacing，不能靠空格、margin 或 padding 模拟。
为什么直接给 code 加 letter-spacing 有时没反应
常见不是写错了，而是被其他样式压制或渲染限制卡住：
-
code常被重置为font-family: monospace，某些等宽字体（如Courier New）对letter-spacing不敏感，视觉变化微弱 - 父容器设了
white-space: nowrap且宽度不足 → 字符强行撑出，看起来像“没变” - 浏览器对内联等宽元素的
letter-spacing支持不一，旧版 Safari 在code上可能忽略负值 - 若
code套在pre里，而pre设了font-size但没设line-height，行框挤压会掩盖字距变化
code 标签字间距的合理取值范围
中英文混排是 code 的典型场景，统一设一个值容易失衡：
- 纯英文/数字代码：可用
letter-spacing: -0.05em微收，提升紧凑感；超过-0.1em小字号下易粘连 - 含中文注释或变量名（如
const 用户名 = "张三"）：建议用letter-spacing: 0.02em～0.05em，避免汉字“断开” - 绝对像素值慎用：
letter-spacing: 1px在font-size: 12px下占比过大，font-size: 16px下又偏小，优先选em - 重置时用
letter-spacing: normal，别写0—— 因为不同字体的normal实际值不同，语义更准
如何只影响 code 本身，不波及内部子元素
code 是内联元素，但常嵌套 span 高亮关键词，或 em 强调。若直接在 code 上设 letter-spacing，子元素会继承并叠加：
- 加
code > *覆盖：例如code { letter-spacing: 0.03em; } code > * { letter-spacing: normal; } - 用
:not()排除：如code:not(.no-spacing) { letter-spacing: 0.02em; }，再给需要保持原样的加class="no-spacing" - 避免在
code外层容器（如div或pre）上设letter-spacing—— 它会透传到所有文本，包括换行符和空格，导致缩进错乱
真正难调的是等宽字体 + 中文 + 高亮语法的组合，letter-spacing 只能微调，救不了字体本身的 kerning 缺陷；如果发现无论怎么调都“发虚”或“粘连”，该换字体了，比如换成 JetBrains Mono 或 Fira Code，它们自带连字和优化字距。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
