size-adjust 是 @font-face 内的字体描述符，仅在 font-display: swap 下生效，作用于回退字体链首个可用字体，值必须为百分比，且受 line-height 等显式设置干扰。
size-adjust 不是 HTML 属性，也不是通用 CSS 属性，它是 @font-face 规则内的一个字体描述符（descriptor），只在定义自定义字体时生效。它不作用于元素，也不能写在 style 或内联样式里。
size-adjust 必须配合 font-display: swap 才起效
- 单独写
size-adjust: 102%但没配font-display: swap，浏览器直接忽略 -
font-display: optional或auto下，size-adjust不触发占位逻辑 - 原因：只有
swap模式才明确区分「初始回退渲染」和「字体加载后替换」两个阶段，size-adjust只干预前一阶段的尺寸预留
回退字体链中，size-adjust 只影响第一个匹配的回退字体
- 若你写：
font-family: "MyFont", "SF Pro Text", system-ui; - 浏览器先尝试
"MyFont"（加载中 → 显示回退） - 回退时优先选
"SF Pro Text"（如果可用），此时size-adjust的调整就作用于它 - 如果
"SF Pro Text"不可用，降级到system-ui，size-adjust不会继续作用于system-ui - 所以测试时务必禁用你指定的第一个回退字体（比如在 DevTools 里 Force substitution 为
"SF Pro Text"），而不是随便选个系统字体
size-adjust 的值必须带 % 单位，且不能靠猜
- 错误写法：
size-adjust: 1.03、size-adjust: 103、size-adjust: 103px - 正确写法：
size-adjust: 103%（仅支持百分比） - 推荐调试路径：
- 在 Chrome 或 Edge 中打开 DevTools → Elements 面板 → 选中目标文本
- 右键 →
Force font substitution→ 选你链中第一个回退字体（如SF Pro Text） - 切换到 Rendering 面板 → 勾选
Layout Shift Regions - 硬刷新（
Ctrl+Shift+R），观察红框是否明显 - 在
@font-face中逐步试101%→102%→103%，每次保存后硬刷
- 过调（如
110%）会导致初始占位过高，字体加载后文字“塌下去”，反而放大 CLS
兼容性差，Firefox 完全不支持，别当全局方案用
- 当前（2026 年 5 月）仅 Chromium 内核（Chrome、Edge、Opera）和 Safari 17.4+ 支持
- Firefox 对
size-adjust无任何实现，连解析都不做 - 如果你依赖它防 CLS，必须搭配 JS 检测：
if ('sizeAdjust' in CSS.supports)或直接 fallback 到font-size-adjust+ 字体 aspect 值预估（虽然后者也只在 Firefox 里稳定）
真正容易被忽略的一点：size-adjust 和显式 line-height 冲突——只要你在元素上写了 line-height: 1.5，它就会覆盖 size-adjust 对行高预留的修正效果。想让它生效，得让行高由字体自身度量驱动，而不是人工钉死。
