iOS字体偏移本质是Core Text严格解析字体度量所致，需放弃依赖字体自带ascent/descent，改用line-height:1.4+padding显式控制垂直空间，系统字体栈优先，真机调试验证。
iOS 上用自定义字体（比如 PingFangSC、Source Han Serif 或其他非系统字体）时，文字常出现上下偏移、基线错位、行高塌陷或小字号发虚——这不是 bug，是 Core Text 渲染引擎对字体度量（ascent/descent/baseline）的严格解析所致。
iOS 字体偏移的本质原因
系统默认用 San Francisco 字体时，iOS 的排版引擎已内置了该字体的精确度量参数；但加载第三方 @font-face 字体后，浏览器无法自动校准其 ascent、descent 和 line gap，导致 line-height 计算失准、vertical-align 失效、甚至 padding 视觉错位。
- 现象：同一段
font-size: 14px文字，在 iOS Safari 中比 Android Chrome 高出 2–3px，或底部被裁切 - 关键点：
font-display: swap不会缓解偏移，只影响加载时机 - 注意：
font-variation-settings: "BASELINE" 0在当前 iOS（17+）仍不被支持，写上也无效
用 line-height + padding 手动微调基线位置
最稳定、兼容所有 iOS 版本的做法：放弃依赖字体自带度量，改用 CSS 显式控制垂直空间。
- 统一设置
line-height: 1.4（不要用无单位数值，iOS 对line-height: 1.4解析更一致） - 对文字容器加
padding-top和padding-bottom补偿视觉空隙，例如：padding: 4px 0; - 若需精确对齐图标或按钮，用
transform: translateY(-1px)局部修正，而非改margin - 避免在
span或sup内嵌套自定义字体再设vertical-align，iOS 下极易失效
优先使用系统字体栈，再 fallback 到自定义字体
不是所有场景都需要强控字体。iOS 上真正需要「强制换字体」的，通常是品牌文案或设计稿强约束；其余正文、按钮、提示语，用系统字体栈反而更稳、更省资源。
立即学习“前端免费学习笔记（深入）”；
- 推荐写法：
font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif; - 其中
"PingFang SC"是 macOS/iOS 原生中文字体名（注意空格和大小写），系统存在时直接命中，无需@font-face加载 - 若必须用非系统字体（如思源宋体），建议只在
h1、.logo等少量元素上启用，并配合font-display: optional降低阻塞风险 - 慎用
font-weight数值映射：iOS 对font-weight: 300的解析可能 fallback 到 400，建议用命名值（light/normal/bold）更可靠
WOFF2 + preload 是性能底线，但不能解决渲染偏移
字体文件加载快 ≠ 渲染准。WOFF2 格式能减少体积、提升首屏速度，但它不改变字体自身的度量缺陷。
- 务必加
<link rel="preload" href="fonts/PingFangSC-Regular.woff2" as="font" type="font/woff2" crossorigin> -
crossorigin属性不可省，否则 iOS Safari 会拒绝加载字体 - 不要指望
font-feature-settings或text-rendering: optimizeLegibility修复偏移，它们影响的是字形细节，不是基线定位 - 真要验证效果，必须在真机（iOS 16/17/18）上用 Safari 开发者工具检查 computed
line-height和height，模拟器不准
最易被忽略的一点：iOS 字体偏移问题从来不是“有没有加载成功”的问题，而是“有没有主动放弃依赖字体元数据”的问题。你越想让浏览器替你算好一切，它就越容易在 Core Text 下给你一个意外结果。
