rgb() 逗号语法已被 css color level 4 规范正式标记为 obsolete，仅因兼容性被浏览器保留；它无法表达透明度，现代工具链中易静默失效，必须改用空格分隔+斜杠 alpha 的语法。
rgb() 逗号语法已被规范标记为 obsolete，不是“还能用就没事”
CSS Color Level 4 明确将 rgb(255, 0, 0) 这类写法列为 过时（obsolete），不是建议、不是警告，而是规范层面的正式弃用。浏览器保留兼容，仅因历史包袱，不代表它被鼓励或安全——尤其在构建流程、自定义属性、新颜色空间中，它会悄悄失效。
逗号语法在现代工具链里容易静默崩坏
PostCSS、esbuild 等工具压缩 CSS 时可能抹掉空格或重排参数，把 rgb(255, 0, 0) 变成 rgb(255,0,0) 或更糟；而新版解析器（Chrome 117+、Firefox 119+）优先匹配空格语法，遇到逗号版会 fallback 处理——但 fallback 不保证覆盖所有上下文：
-
rgb(var(--r), var(--g), var(--b))在 Safari 17.4 和部分 Android WebView 中解析不稳定，有时返回transparent或直接丢弃整条声明 - 构建后若混入
rgb(255 , 0 , 0)（带空格的逗号），某些旧版 PostCSS 插件会误判为非法，转成空值 - 压缩器若未识别 Level 4 语法，可能把
rgb(255 0 0 / 0.5)错压成rgb(255 0 0/0.5)（斜杠紧贴数字），Safari 17.4 拒绝解析
空格 + 斜杠才是 alpha 的唯一合法入口
逗号语法根本无法表达带透明度的 rgb 值：rgb(255, 0, 0, 0.5) 是非法的，浏览器直接忽略整条规则；而现代语法强制用斜杠分隔 alpha：rgb(255 0 0 / 0.5)。这不是风格偏好，是语法结构升级：
- 空格是参数分隔符，类似函数调用中的空格，
rgb(255 0 0)等价于三个独立数值参数 -
/ 0.5是命名参数（named parameter），斜杠不可省略、不可替换为逗号或等号 - 百分比 alpha 同样有效：
rgb(255 0 0 / 50%)，但rgb(255 0 0 / 50)（漏%）会被当作无效值丢弃 - 混用单位直接失效：
rgb(100% 87 51)整条声明静默移除，不报错也不回退
Sass/Less 等预处理器输出仍默认逗号，需主动干预
多数 Sass 版本（包括 1.77.x）的内置 rgb() 函数仍输出逗号语法，除非你显式启用 Level 4 支持或改用插值：
- 错误写法：
rgb($r, $g, $b)→ 输出rgb(255, 0, 0) - 正确写法：
rgb(#{$r} #{$g} #{$b})→ 输出rgb(255 0 0)（注意变量外无引号） - 加 alpha 时必须确保变量非空：
rgb(#{$r} #{$g} #{$b} / #{$a})若$a未定义，生成rgb(255 0 0 / )→ 解析失败 - PostCSS 插件如
postcss-color-function需 ≥6.x 才能正确处理空格语法，旧版会把它转回逗号
rgb()，而是团队里有人手写逗号、有人依赖构建工具输出空格、压缩器再一搅和——最终线上颜色在深色模式下偏灰、在高对比度设置里消失，而控制台连个警告都没有。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
