-webkit-font-smoothing 在 ios safari 和 webview 中完全无效，因 webkit 硬性限制无法干预系统级字体渲染；真正影响清晰度的是 font-display、viewport 缩放控制及 font-weight 值匹配。
font-smoothing 在 iOS 上根本不起作用
直接说结论：-webkit-font-smoothing 在 iOS Safari 和 WebView 中被完全忽略，无论设成 antialiased 还是 subpixel-antialiased，渲染行为都不会变。这不是配置问题，是 WebKit 的硬性限制——iOS 系统级字体渲染策略不允许网页干预。
常见错误现象：开发者在 CSS 里写了 -webkit-font-smoothing: antialiased;，发现 iPhone 上文字依然发虚、边缘带灰边，误以为是没生效或优先级不够，反复加 !important 或调整 font-weight，其实只是白忙。
- iOS 13+ 后，系统默认使用“自动抗锯齿+次像素渲染”，但仅对系统字体（如
-apple-system）生效，网页自定义字体（WOFF2/TTF）无法享受同等优化 - Android Chrome 支持
-webkit-font-smoothing，但效果有限，且新版已逐步弃用该属性 -
font-smooth（无前缀）是过时的 CSS Level 3 提案，所有主流浏览器均未实现
真正影响移动端字体清晰度的是 font-display 和字体加载时机
模糊感多数来自字体回退（fallback）阶段：浏览器先用系统默认字体（如 San Francisco 的细体变体）渲染，等自定义字体下载完成再重绘——这个过程常伴随字号缩放、字宽重排，造成视觉抖动和临时模糊。
关键不是“怎么让字体更平滑”，而是“怎么让正确字体更快、更稳地出现”。font-display 是唯一可控入口：
-
font-display: swap;：最常用，但首屏可能闪出系统字体，尤其小字号下对比明显 -
font-display: optional;：适合非关键文本，iOS 下更倾向跳过加载慢的字体，避免模糊期延长 -
font-display: block;：会阻塞文本渲染最多 3s，适合标题类内容，能彻底规避回退模糊
示例：
@font-face {
font-family: "Inter";
src: url("inter.woff2") format("woff2");
font-display: optional;
}
viewport 缩放与 device-pixel-ratio 导致的物理模糊
真机上文字发虚，有时跟 CSS 无关，而是页面被意外缩放了。iOS Safari 默认允许双指缩放，如果用户手动放大过，或者 viewport meta 写错，就会让 CSS 像素和物理像素不匹配，字体自然糊。
检查点很具体：
- 确保
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">中没有漏掉maximum-scale=1.0——少了这句，即使初始 scale 是 1，后续仍可能被缩放 - 避免用
rem或em配合动态根字体大小（如 JS 调整document.documentElement.style.fontSize），在高 DPR 设备（iPhone 12+ 是 3x）下易触发亚像素渲染失准 - 用
px定义字号（如font-size: 16px;）比相对单位更稳定，尤其在body和正文层级
font-weight 数值不匹配引发的渲染降级
iOS 对 font-weight 的解析极严格。比如你引入了 Inter 字体的 400 和 700 两个粗细，但 CSS 里写了 font-weight: 500;，WebKit 就不会用 400 回退，而是直接切到系统字体（San Francisco 的 Regular），而系统字体在非主文案场景下渲染质量明显偏低。
解决方法很简单，但容易被忽略：
- 查清你实际加载的字体文件支持哪些
font-weight值，别信 CDN 文档写的“支持 100–900” - CSS 中只用你明确提供的 weight 值，比如只加载了 400 和 700，就只写
font-weight: 400;或700; - 避免用
font-weight: bold;，它在不同浏览器映射的数值不同（Chrome 是 700，Safari 可能是 600），增加不确定性
一个快速验证方式：打开 Safari 开发者工具 → Elements → 选中文本节点 → 看右侧面板 “Computed” 里的 font-family 实际值，如果是 "-apple-system" 而非你的字体名，基本就是 weight 不匹配或 font-display 触发了回退。
真正卡住人的，从来不是要不要加 -webkit-font-smoothing，而是搞不清模糊到底来自字体加载、缩放失准，还是 weight 映射失败——三个地方一碰头，调试就变成玄学。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
