safari ≤15.3 完全忽略 font-variant-numeric: tabular-nums，不报错、不渲染、devtools 不显示，需用 font-feature-settings: "tnum" 替代并确保字体含 tnum 特性。
font-variant-numeric: tabular-nums 在 Safari ≤15.3 中完全不生效
它不是“渲染异常”，而是被浏览器静默跳过：CSS 规则不报错、DevTools 样式面板里看不到该属性、getComputedStyle(el).fontVariantNumeric 返回 "normal" 或空字符串。这意味着你写了也等于没写，连降级逻辑都难触发。
真正稳定支持从 Safari 15.4 开始（2022 年 3 月发布），当前（2026 年）iOS / macOS 用户基本已覆盖，但仍有内网或教育场景残留旧版 Safari。
- 别信
@supports (font-variant-numeric: tabular-nums)：Safari ≤15.3 可能返回true却完全不渲染 - 验证必须用实测：创建临时
<span></span>，填入"0123456789"，用getBoundingClientRect().width对比宽度是否恒定 - 若需兼容旧 Safari，优先改用
font-feature-settings: "tnum"（Safari 14+ 已支持，更底层、更可靠）
为什么 Safari 15.3 及更早版本会忽略这个属性
根本原因不是 Safari “故意不支持”，而是其 WebKit 引擎早期未实现 OpenType 特性激活链路——font-variant-numeric 是一个高层语义开关，依赖底层字体引擎识别并启用 tnum 特性。旧版 WebKit 直接跳过了整条解析路径。
Plan Dubai Travel — Flights, Hotels, Burj Khalifa, Desert Safari, Malls & Itineraries
下载
规划您的迪拜之旅 — 哈利法塔观景、沙漠探险、迪拜购物中心购物、棕榈岛度假村及黄金市场砍价。还提供支持...
- 它不抛错、不警告，也不 fallback 到
proportional-nums，就是“不存在” - 即使字体本身含
tnum字形（如 SF Mono），也无法被调用 - 同理，
font-variant-numeric: oldstyle-nums等其他值也一样被忽略
font-feature-settings: "tnum" 是更稳妥的替代写法
font-feature-settings 绕过 CSS 语义层，直接向字体引擎发送 OpenType 指令，在 Safari 14+、Firefox 88+、Chrome 49+ 均表现一致，且对字体特性的激活更敏感。
- 写法必须严格：
font-feature-settings: "tnum";（引号不能少，大小写必须小写） - 不支持多值简写，如同时开
tnum和lnum得写成font-feature-settings: "tnum", "lnum"; - 可与
font-variant-numeric共存，现代浏览器以font-feature-settings为准，旧浏览器只认后者（如果支持） - 示例组合：
font-family: "SF Mono", "Fira Code", monospace; font-feature-settings: "tnum";
字体本身没打包 tnum 特性才是最大盲区
即使 Safari 16+、Chrome 110+ 全部支持，font-variant-numeric: tabular-nums 仍可能毫无反应——因为字体文件压根没包含等宽数字字形。
- iOS 系统默认用
PingFang SC，不含tnum；只有SF Pro Display等 Pro 版本才带 - Google Fonts 的
roboto-v20-latin默认子集不含tnum，需手动加&text=0123456789参数请求定制 - 验证方法：在 DevTools 中临时加
font-feature-settings: "tnum";，若数字仍不等宽，换字体栈再试 - 保底方案仍是
font-family: monospace，虽字母汉字也被拉平，但强等宽无条件成立
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
