font-variation-settings语法错误会导致整条声明静默失效：轴名必须单引号包裹、数值不加引号、大小写严格匹配；@font-face漏写format('woff2-variations')会使可变字体退化为静态字体，所有轴控制失效。
font-variation-settings 语法写错就完全失效
浏览器对 font-variation-settings 的语法极其敏感，错一个引号或小数位，整条声明就被静默丢弃——页面看起来“没变化”，其实根本没生效。
-
"wght" 400❌ 双引号包轴名 → 浏览器直接忽略整行 -
'wght' "400"❌ 数值加引号 → 当字符串处理，无法插值、动画卡顿 -
wght 400❌ 轴名不加引号 → 大小写敏感，wght≠WGT -
'wght' 400, 'wdth' 100.5✅ 单引号 + 无引号数字，小数位统一（推荐全用整数或统一保留一位）
@font-face 没声明 format('woff2-variations') 就退化为静态字体
即使你写了正确的 font-variation-settings，只要 @font-face 里漏掉 format('woff2-variations')，浏览器就当它是普通 WOFF2，所有轴控制全部失效——且不报错、不警告。
- Google Fonts 链接默认是
woff2，必须手动把 URL 中的woff2替换为woff2-variations -
format('woff2')或format('woff2 supports variations')都不行，必须严格写成format('woff2-variations') - Firefox（尤其 115 之前）对此最敏感；Chrome/Edge 会静默降级，但
font-weight: 537这类连续值仍会 fallback 到最近离散值（如 400 或 700）
font-weight 和 font-variation-settings 同时存在时后者永远胜出
很多人以为 font-weight: 600 和 font-variation-settings: 'wght' 537 是并存关系，实际是覆盖关系：font-variation-settings 一旦出现，font-weight 就被无视。
- 想用
font-weight做语义标记（比如strong默认加粗），又想用wght精确控制，就得靠@supports分离逻辑 -
@supports (font-variation-settings: normal)块内只写font-variation-settings，不写font-weight - 不支持的环境里，才用
font-weight+ 静态字体 fallback，否则两者混用会导致行为不可预测
slnt 轴不能靠 font-style: oblique 触发
font-style: oblique 对可变字体完全无效——它只是 CSS 渲染层的倾斜模拟，跟字体内部的 slnt 轴毫无关系。想真正左倾或右倾，必须直写 font-variation-settings: 'slnt' -8。
-
slnt值范围通常为 -10 到 10，负值向左倾，正值向右倾；具体上限得查字体文档或用fonttools ttfdump看fvar表 - 别和
ital轴混淆：有些字体（如 IBM Plex Sans Variable）用ital控制正统斜体，slnt专用于手写风/非对称倾斜，二者不可互换 - Safari 16.4 之前版本不支持
slnt，@supports必须包含font-variation-settings和font-style: oblique双条件检测
@font-face 是否让浏览器认出它是可变的——这两点不验证清楚，后面所有 font-variation-settings 都是空中楼阁。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
