firefox 35–99 不支持 grayscale()、oklch()、color-mix() 等现代颜色函数，必须前置静态 fallback（如 #rrggbb 或 rgb()）并用 @supports (color: oklch(0% 0 0)) 包裹新语法，否则整条声明被静默丢弃，导致颜色消失。
Firefox 35–99 不解析 grayscale()、oklch()、color-mix() 等现代颜色函数，必须用 @supports 包裹 + 前置静态 fallback 才能生效。
Firefox 35–99 对 color 函数的实际支持边界
Firefox 从 35 版本起支持 filter: url()，但直到 100+ 才真正解析 grayscale(100%)；oklch() 和 color-mix() 更晚——前者在 Firefox 112+ 支持，后者在 119+ 才启用混合引擎。这意味着写 color: oklch(60% 0.2 240); 在 Firefox 91 里会被整条丢弃，不是变灰，是继承父级文字色（常为黑色），在深色背景下直接不可读。
- 别指望
@-moz-document url-prefix()检测现代函数——它只管解析器类型，不管函数能力 -
hsl()和rgba()在 Firefox 4+ 就已稳定，但旧版 Safari（iOS 12）对单位缺失更敏感，hsl(120, 70, 60)会静默失败 - Firefox 99 及更早版本对
color-mix(in oklch, ...)完全不识别，连语法错误都不报，直接跳过整条声明
@supports 检测必须写全且顺序不能错
只写 @supports (color: oklch) 是无效的——CSS 解析器要求参数完整，否则当语法错误丢弃整个规则块。正确写法是 @supports (color: oklch(0% 0 0))，它检测的是色彩空间基础能力，比检测 color-mix() 更稳。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- fallback 颜色必须写在
@supports外部，且在同一选择器内前置：color: #4a6fa5;→color: oklch(0.6 0.2 240); - 把
@supports块写在前面，某些旧 Chromium（如 Android 4.4 WebView）会忽略后续普通声明，导致最终无颜色 - 别用
@supports not (color: oklch(0% 0 0))写降级——部分安卓 WebView 对not解析异常，直接跳过整段
Firefox 旧版常见失效现象与绕过方式
最典型的失效不是“颜色不对”，而是“颜色消失”：浏览器静默跳过整条声明，取继承值或初始值。比如 background-color: color-mix(in srgb, red, blue); 在 Firefox 111 之前等于没写，背景变成透明或父容器色。
-
grayscale()在 Firefox ≤99 中无效，但filter: url(#grayscale)可用（需内联 SVG 定义滤镜） -
color-contrast()在 Firefox 中至今未支持，任何使用都会导致文字不可见，必须搭配color: #000;前置 - 不要在
:root里定义--primary: color-mix(...)后全局复用——旧版 Firefox 对自定义属性里的函数解析更保守，优先写在具体选择器中 - 十六进制简写
#abc和rgb()没问题，但lch()在 Firefox 119 之前一律被忽略，混在color-mix()里也不会报错，只是整个函数失效
真正麻烦的不是语法不支持，而是失效时毫无提示——颜色没了，开发者却以为是逻辑问题。只要记住：所有现代 color 函数在 Firefox 旧版里都是“全有或全无”，没有中间态，fallback 必须肉眼可见地写在上面，不能藏在媒体查询或 JS 里。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
