RRGGBBAA比rgba()少打字但易翻车：虽省11字符，却零容忍格式错误（如引号、空格、位数不对），且AA为十六进制透明度非百分比，兼容性差需fallback，CSS变量中使用也有严格约束。
为什么#RRGGBBAA比rgba()少打字但容易翻车
它确实更短：#2563eb80（8字符） vs rgba(37, 99, 235, 0.8)（19字符），省了11个字符。但代价是格式零容忍——错一位、多一空格、加引号，整条声明就静默失效，控制台不报错，颜色直接回退到继承值或默认黑。
-
#2563eb80✅ 正确：8位、小写、无空格、无引号 -
"#2563eb80"❌ 引号让值变成字符串，color属性忽略 -
#2563eb 80❌ 空格中断解析，整条声明被丢弃 -
#2563eb8❌ 少一位，不是8位就不认
AA不是百分比，是十六进制透明度值
#RRGGBBAA末两位AA是十六进制数，不是“80%透明”，而是128 ÷ 255 ≈ 0.502不透明度（即约49.8%透明）。常见映射：00=全透，80≈50%透，CC≈80%透，FF=不透。
-
rgba(0,0,0,0.5)→ 对应#00000080，不是#00000050 - 写成
#00000050会得到≈31%透明，而非预期的50% - 工具链（如VS Code、Stylelint）可能误删或报错，尤其未启用CSS Color Level 4支持时
兼容性兜底必须手动写，且顺序不能错
IE全系、Safari ≤15、老安卓 WebView 都不识别#RRGGBBAA。浏览器不会自动降级，你得显式提供 fallback：
background-color: #2c3e50; background-color: rgba(44, 62, 80, 0.85); background-color: #2c3e50d9;
- fallback（六位色或
rgba()）必须写在前面，#RRGGBBAA放最后 - 反过来写，IE8及以下会跳过所有声明，背景变透明黑
-
rgba()仍是兼容性最稳的选择：IE9+、Android 2.3+、iOS 4.3+ 全支持
CSS变量里用#RRGGBBAA的三个硬约束
在:root里定义--primary: #2563eb80;没问题，但使用时极易踩坑：
立即学习“前端免费学习笔记（深入）”；
- 必须写成
color: var(--primary);——浏览器才能原样解析为带 alpha 的颜色 -
--primary: "#2563eb80";❌ 引号导致变量值是字符串，color无法识别 -
--primary: #2563eb80;写错一位（比如#2563eb81），不会高亮报错，只默默 fallback 到初始值（如黑色），极难排查 - 变量不支持拼接：
--bg: #2563eb + "80";这类写法完全无效，CSS 不提供字符串运算
