chrome中text-justify: inter-character不生效的常见原因：版本低于104时浏览器静默忽略；未同时设置text-align: justify；容器宽度过小或文本过短导致渲染引擎主动放弃拉伸。
text-justify: inter-character 在 Chrome 中不生效的常见原因
Chrome 104+ 才开始支持 text-justify，旧版 Chrome（比如 103 及更早）会直接忽略该声明，只当没写。如果你在 Chrome 中发现 text-align: justify 搭配 text-justify: inter-character 完全没反应，先检查浏览器版本：navigator.userAgent 或 DevTools 的 “Help → About Google Chrome”。不支持时，浏览器不会报错，也不会 fallback，就是静默失效。
为什么加了 letter-spacing 反而让对齐更糟
letter-spacing 是全局加在每个字符间隙上的偏移量，它和 text-justify 的字间距拉伸逻辑是叠加关系——不是替代，而是干扰。尤其在中英文混排时：
- 中文段落本应靠
text-justify: inter-character动态调整字距来撑满，但letter-spacing: -0.15em会先压缩所有字距，导致后续 justify 拉伸余量不足，甚至出现“挤成一团”或“最后一行塌陷” - 英文单词内部无空格，
letter-spacing会强行在字母间插入负值，破坏单词可读性，且与hyphens: auto冲突 - 移动端小屏下，单行仅 3–4 字时，
letter-spacing负值易造成视觉断层，比不设还难看
真正有效的 Chrome 兼容方案（非降级）
前提是目标环境可控（如企业内网、PWA、已知 Chrome 版本 ≥104）：
- 必须同时声明：
text-align: justify和text-justify: inter-character，缺一不可；text-justify不继承，子元素需显式设置或用inherit - 末行对齐必须额外处理：优先用
text-align-last: justify（Chrome 104+ 支持），比伪元素更轻量；若需兼容旧版 Chrome，则用::after { content: ""; display: inline-block; width: 100%; }，并确保父容器overflow: hidden防止撑高 - 避免在
inline元素（如span）上直接设text-align，它只对块级或inline-block生效；若内容来自富文本，建议包裹一层div并设display: inline-block
当 Chrome 版本不可控时的务实 fallback
不要硬扛 text-justify，改用已被验证的“空格 + letter-spacing”组合，但要控制副作用：
- JS 注入空格仅限纯中文段落：
"文字内容".split("").join(" ")，再设letter-spacing: -0.05em（不是 -0.15em），数值越大越危险 - 必须加
word-break: keep-all防止浏览器在汉字间意外断行 - 对含英文/数字/标点的混排段落，放弃两端对齐，降级为
text-align: left+ 合理line-height和字体选择（如 Noto Sans SC），视觉节奏反而更稳 - 服务端渲染时可判断 UA，对旧 Chrome 返回预处理后的带空格 HTML，避免客户端 JS 重排闪动
width 过小（比如 200px 内放 5 个汉字），浏览器仍可能拒绝拉伸——这不是 bug，是渲染引擎主动放弃对齐以保可读性。此时加再多 letter-spacing 都没用，得靠媒体查询扩大最小宽度或换排版策略。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
