Firefox 不支持 font-smooth 属性，仅支持 -moz-osx-font-smoothing（仅 macOS 有效）和 -webkit-font-smoothing（WebKit/Blink 内核有效），二者作用机制与取值效果需严格区分。
Firefox 的 font-smooth 根本不存在
别在 Firefox 里写 font-smooth，它不支持这个属性，写了也无效。Mozilla 从未实现过该私有属性，官方文档和实际渲染都证实这一点。你看到的“Firefox 支持”多是混淆了旧版 WebKit（如 Safari 5.1）或误读了已废弃的 -moz-osx-font-smoothing（仅 macOS 有效，且只影响抗锯齿方式，不是开关）。
真正可用的只有：
-
-webkit-font-smoothing: antialiased（Chrome、Safari、Edge 基于 Chromium） -
-moz-osx-font-smoothing: grayscale（仅 Firefox on macOS，Windows/Linux 下完全忽略）
-webkit-font-smoothing 的三个取值实际效果差异
这个属性只在 WebKit/Blink 内核生效，取值并非“开/关”二元控制，而是指定抗锯齿策略：
-
subpixel-antialiased：默认值，利用子像素渲染提升清晰度，但在高 DPI 屏幕或缩放下易出现色边 -
antialiased：关闭子像素，用灰阶平滑，文字更柔和、边缘更干净，适合中英文混排或深色背景 -
none：禁用所有抗锯齿，文字锐利但锯齿明显，基本只用于调试或特殊视觉风格
注意：antialiased 在 Retina 屏上仍会做灰阶处理，并非“变模糊”，而是牺牲一点锐度换一致性。
为什么加 -moz-osx-font-smoothing 后 Firefox 没反应
因为这个属性有严格前提：
- 仅在 macOS 系统上的 Firefox 生效（Windows/Linux 版本直接忽略）
- 仅对系统默认字体栈（如
system-ui、-apple-system）或启用 macOS 字体渲染路径的文本起作用 - 必须配合
font-weight和font-size合理设置——过小（900）时系统可能回退到其他渲染逻辑，导致失效
常见错误是把它当全局开关加在 body 上就以为搞定，其实得结合 @supports (-moz-osx-font-smoothing: grayscale) 条件应用，且优先级要高于其他字体相关声明。
现代项目里要不要主动设字体平滑
多数情况下不需要手动干预。Chrome 100+、Firefox 102+、Safari 16+ 已大幅统一默认渲染行为，尤其在启用了 text-rendering: optimizeLegibility 或使用 system-ui 字体时，系统会自动选择合适策略。
只有当你明确遇到以下问题才考虑加：
- Safari 下中文标题发虚（可试
-webkit-font-smoothing: antialiased） - macOS Firefox 中英混排出现粗细不均（可试
-moz-osx-font-smoothing: grayscale） - 设计稿要求文字边缘绝对干净（如深底白字 banner），且测试确认仅
antialiased满足
跨平台一致性的最大障碍从来不是属性本身，而是字体文件是否嵌入、是否启用 font-display: swap、以及系统是否禁用了 ClearType / Core Text ——这些比一行 CSS 影响更大。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
