-webkit-font-smoothing 是仅在 macos safari/chrome 有效的私有属性，在 ios 和 android 上均无效；其无法解决移动端字体发虚、毛刺等问题，真正有效的优化是弹性根字号、text-rendering: optimizelegibility 及合理字体 fallback。
-webkit-font-smoothing 是 Safari 和 Chrome（基于 WebKit/Blink）在 macOS 和 iOS 上控制字体抗锯齿行为的私有属性，它不适用于 Android 浏览器或 Windows 上的 Chrome/Edge，也不能解决移动端普遍存在的“字体发虚”“文字边缘毛刺”或“小字号渲染过细”等问题——它只影响子像素渲染策略，且仅在支持子像素抗锯齿的系统上生效（如 macOS，但 iOS 已忽略该属性）。
-webkit-font-smoothing 在 iOS 上完全无效
iOS 自 iOS 7 起就强制禁用子像素渲染，所有文本统一使用灰度抗锯齿（grayscale antialiasing），因此：
- 设置
-webkit-font-smoothing: subpixel-antialiased或antialiased均无实际效果 - iOS 上的
font-smoothing属性会被浏览器直接忽略，DevTools 中甚至不会显示为已应用 - 这不是 bug，而是 Apple 的主动设计：为保证 Retina 屏幕下文字清晰度与可读性一致性
你看到的“iOS 字体偏细”“小字号发虚”，根源不在渲染开关，而在：
- 系统默认启用「视觉字号缩放」（Dynamic Type / Accessibility scaling）
-
font-size使用了固定px单位，未适配rem或em+ 根字体缩放 - 缺少
text-rendering: optimizeLegibility（对中文影响有限，但对英文连字、字距有帮助）
移动端真正有效的字体渲染优化手段
与其折腾无效的 -webkit-font-smoothing，不如聚焦以下三点：
- 给
html设置弹性根字号，例如：html { font-size: clamp(14px, 2.5vw, 18px); }，让小屏自动缩小、大屏适度放大，同时兼容系统字号偏好 - 对正文文本启用
text-rendering: optimizeLegibility（仅 Safari/iOS 有效，Chrome on Android 忽略），可改善字母间距与连字表现 - 避免在
font-size中使用小于14px的绝对值（iOS Safari 默认最小可读字号为 14px，低于此值会强制放大并模糊）；若必须小字，改用transform: scale(0.8)+origin控制基线，但需注意可访问性影响
安卓端字体渲染差异比想象中更大
Android 各厂商 WebView（尤其旧版 Samsung Internet、UC、QQ 浏览器）对 font-smoothing 完全不识别，且：
- 多数 Android 系统默认关闭子像素渲染（即使声明也无效）
- 字体渲染质量高度依赖系统预装字体（如华为不预装
Microsoft YaHei，"PingFang SC"在安卓上根本不存在） - 推荐 fallback 链严格按平台分层：
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
这条链在 iOS/macOS/Android/Windows 上都能落到合理字体，比硬写"Microsoft YaHei"更可靠
-webkit-font-smoothing 是个典型“看起来有用、实则过时且平台受限”的属性。现在真正影响移动端字体可读性的，是根字号策略、单位选择（rem vs px）、系统字体 fallback 设计，以及是否尊重用户在「设置 → 显示与亮度 → 文字大小」中调整的全局缩放偏好。别再把它当万能开关了。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
