结论：别再用 -webkit-font-smoothing，它在 chrome 120+ 和 firefox 中已完全失效，windows 下从不生效，macos 上还可能让中文字体发虚；现代浏览器仅响应 font-optical-sizing: auto、显式 font-weight 数值和 text-rendering: optimizelegibility 等标准属性。
直接说结论：别再用 -webkit-font-smoothing，它在 Chrome 120+ 和 Firefox 中已完全失效，Windows 下从不生效，macOS 上还可能让中文字体发虚。
Chrome 120+ 和 Safari 对 -webkit-font-smoothing 的处理完全不同
Chrome 120+ 已彻底移除对该属性的解析逻辑，声明了也等于没写，DevTools 中常显示为 “invalid” 或直接不出现；Safari（macOS/iOS）仍支持，但只在特定条件下起效：系统没关闭「字体平滑」、文本没被 transform 或 text-rendering 干扰、且未启用硬件加速等。你看到“Mac 上有效、Win 上无效”，本质是 Safari 还认它，Chrome 根本不读。
-
-webkit-font-smoothing: antialiased在 macOS 上会让 PingFang SC、Noto Sans CJK 等中文字体边缘变细、灰阶过渡生硬，小字号下明显发虚 - 全局写在
body上极易被 React 组件内联样式或 CSS-in-JS 高权重规则覆盖 - 只要文本带
font-weight: bold或transform: scale(1.001)，WebKit 就自动跳过该属性 - macOS 系统设置里关闭了「字体平滑」，Safari 会强制降级，CSS 声明完全失效
Firefox 根本不支持 font-smooth 和 -webkit-font-smoothing
Firefox 从未实现 font-smooth，写了也白写；-moz-osx-font-smoothing 仅对 macOS 版 Firefox 有效，Windows/Linux 版本直接忽略。而且它只影响抗锯齿方式，不是开关——必须配合 @supports (-moz-osx-font-smoothing: grayscale) 条件使用，且优先级要高于其他字体相关声明，否则照样不生效。
- 常见错误：把
-moz-osx-font-smoothing: grayscale加在body上就以为搞定，其实它只对system-ui或-apple-system这类系统字体栈起作用 - 字体大小过小（如
font-size: 12px）或字重过大（如font-weight: 900）时，系统可能回退到其他渲染路径，导致该属性失效
真正跨浏览器可控的替代方案只有三个标准属性
别再调试私有前缀，现代浏览器只响应以下组合：
-
font-optical-sizing: auto：必须搭配含opsz轴的可变字体（如 Inter、Roboto Flex），根据字号自动切换光学尺寸设计，比任何抗锯齿 hack 更有效 -
font-weight显式用数值（如450或500），避免normal在 Windows 上映射为粗 hinting 导致糊团 -
text-rendering: optimizeLegibility：在多数现代浏览器中激活连字和更精细字距调整，对英文/数字提升明显，中文影响小但无害
顺手删掉所有 -webkit-font-smoothing 和 -moz-osx-font-smoothing 声明——它们现在只增加维护成本，不解决实际问题。
字体渲染差异往往和 font-weight 的实际映射有关
你写 font-weight: 500，但 Windows 上 SimSun 根本没有 500 字重，浏览器就近匹配 400 或 700；而 macOS 的 PingFang SC 则有完整字重支持。这种底层不一致，-webkit-font-smoothing 一丁点都管不了。
- 中文字体优先声明
"PingFang SC", "Microsoft YaHei", sans-serif这类已知度量稳定的组合，而非泛泛写sans-serif - 用
font-display: swap+@font-face加载统一字体（如 Inter），避开系统字体差异 - 显式设置
line-height为无单位数值（如1.4），避免不同引擎对em单位的继承计算偏差
最常被忽略的一点：用户反馈“文字模糊”，第一件事不是改 CSS，而是问：“你的 macOS 字体平滑开关开着吗？”——系统级设置会覆盖所有 CSS 声明。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
