现代颜色函数在旧版safari中静默失效，必须在同一选择器内前置静态色（如#4a6fa5）再写oklch()或color-mix()，且@supports检测须用(color: oklch(0% 0 0))等完整语法，fallback不可包在@supports内或拆至其他规则。
现代颜色表示法（如 oklch()、color-mix()）在 Safari 16.3 及更早版本中会被整条声明静默丢弃，不是降级、不报错、也不触发 fallback —— 必须在同一选择器内前置静态色值，且 @supports 检测写法有硬性限制。
oklch() 和 color-mix() 的 fallback 必须写在同一选择器里，且顺序不能反
旧版 Safari（包括 iOS 15.6、macOS Monterey）不认识 oklch() 或 color-mix()，遇到就跳过整行声明。它不会取上一个有效值，也不会继承父级颜色，而是直接用默认值（比如文字变黑、背景变透明）。
-
color或background-color声明必须写两行：第一行是安全色（如#4a6fa5或rgb(74, 111, 165)），第二行才是现代语法 - 不能把 fallback 拆到不同 class、不同媒体查询，或包在
@supports里——否则旧 Safari 根本看不到第一行 - 错误写法：
@supports (color: oklch(0% 0 0)) { button { color: oklch(60% 0.2 240); } }→ 旧 Safari 连这个块都不解析，最终没颜色 - 正确写法：
button { color: #4a6fa5; color: oklch(60% 0.2 240); }
@supports 检测必须用完整有效声明，不能只写函数名
@supports 不是万能开关，对色彩函数的检测极易失效。Safari 16.3 及更早版本连 color-mix 这个特性名都不认识，写 @supports (color-mix: ...) 整个规则会被忽略。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- ✅ 安全检测：
@supports (color: oklch(0% 0 0)) { ... }—— 检测基础色彩空间是否被识别 - ✅ 可用但需完整：
@supports (background: color-mix(in srgb, red, blue)) { ... }—— 括号内必须是语法正确的完整声明 - ❌ 无效检测：
@supports (color-mix: oklch(0% 0 0) 50%, red)—— 特性名不存在，整个@supports块被跳过 - ❌ 白写检测：
@supports (color: oklab(0 0 0))—— 当前主流浏览器基本不支持oklab()，永远 fallback
color-mix() 的混合空间必须显式声明，否则 Firefox 渲染偏灰
Chrome 111+、Firefox 112+、Safari 16.4+ 虽都支持 color-mix()，但默认混合空间不一致：Firefox 默认用 srgb-linear，Chrome/Safari 用 srgb。不写 in srgb，同一行代码在 Firefox 里颜色明显发灰。
- 必须写全：
color-mix(in srgb, red 50%, blue 50%)，不能省略in srgb - 别混用色彩空间：
color-mix(in oklch, #4a6fa5, oklch(60% 0.2 240))合法；color-mix(in oklch, rgb(74,111,165), oklch(60% 0.2 240))会解析失败 - 旧版 Safari 完全忽略该函数，所以 fallback 颜色必须前置，且不能依赖
@supports包裹
HEX/RGB 与 oklch() 混用时亮度错位，别直接替换设计稿色值
把设计稿给的 #4a6fa5 直接替换成 oklch(60% 0.18 250) 看起来差不多，但在深色模式下可能亮度塌陷——因为 oklch() 的 L（亮度）是感知亮度，而 HEX 是设备相关值，映射关系非线性。
- 深色背景下，
oklch(60% ...)实际显示可能比预期更亮，导致文字可读性下降 - 若同时用
prefers-color-scheme: dark，建议为深色模式单独定义一组oklch()值，而不是复用浅色模式的转换结果 - Canvas 元素尤其敏感：设了
background: Canvas，Safari 会当白色处理；改用background: CanvasText反推更稳妥
最容易被忽略的点是：所有 fallback 都必须写在 @supports 外部、同一选择器内、且在现代语法之前。顺序错了，旧 Safari 就真没颜色——它不报错，也不提醒，只默默渲染成黑色或透明。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
