RRGGBBAA仅在明确目标环境支持（Chrome 65+/Firefox 49+/Edge 79+/Safari 15.4+）且无需兼容IE或旧WebView时可用，否则必须搭配rgba() fallback。
直接用 #RRGGBBAA 是可行的，但必须搭配 rgba() fallback，否则旧浏览器会彻底忽略该样式。
什么时候该用 #RRGGBBAA 而不是 rgba()
现代项目中纯 CSS 场景下想省掉 JS 转换、又确定不支持 IE 或 Safari #RRGGBBAA。但注意：
- PostCSS、Sass、Tailwind 等工具链默认不识别 8 位 hex，可能编译报错或压缩丢弃
- 设计稿里给的
#ff6b6b不会自带 alpha，你得手动补两位——补错一位（比如写成#ff6b6b3）会导致整个值无效 -
#RRGGBBAA只作用于颜色本身，不影响子元素；而opacity会透传，这点和rgba()一致，和opacity不同
#RRGGBBAA 的透明度值不是百分比，必须换算
写 #00000050 并不等于 50% 透明度，而是 ≈31%（因为 0x50 = 80，80/255≈0.31）。正确换算方式是：
- 50% →
Math.round(255 * 0.5) = 128→128.toString(16)→80→#00000080 - 30% →
Math.round(255 * 0.3) = 77→4d→#0000004d - 记牢几个常用值：
FF（100%）、CC（≈80%）、80（≈50%）、33（≈20%）、00（0%）
必须显式 fallback，CSS 不会自动降级
只写一行 color: #00000080，IE 和 Safari 12 以下会直接跳过这条声明，可能导致文字变黑或继承父级颜色，调试时很难定位。正确写法是：
立即学习“前端免费学习笔记（深入）”；
color: rgba(0, 0, 0, 0.5); color: #00000080;
- 顺序不能反：浏览器按从上到下解析，老浏览器不认识第二行就用第一行；新浏览器覆盖第一行
- 不要依赖预处理器自动加 fallback——Sass 的
transparentize()输出仍是rgba()，不会生成#RRGGBBAA -
#RGBA简写（如#f008）是陷阱：它被解析为#ff000088，不是你想要的#ff000050，一律禁用
JS 动态注入时，优先转 rgba() 而非拼 #RRGGBBAA
前端运行时拿到一个 #ff6b6b 和透明度 0.3，最稳的方式是走 JS 解析再拼 rgba()：
- 先
hex = hex.trim().replace(/^#/, '')去空格和# - 长度为 3 时扩展为 6 位（
#f00→ff0000），否则parseInt('f', 16)会错 - 取
hex.slice(0,2)、hex.slice(2,4)、hex.slice(4,6)分别转十进制 - alpha 直接用小数
0.3，别自己换算十六进制——这是rgba()的语义，也是设计师沟通的通用单位
真正容易被忽略的是输入校验：空字符串、null、带空格的 " #fff "、甚至 "rgb(0,0,0)" 都可能进来，不 guard 就会产出 rgba(NaN, NaN, NaN, 0.3)，CSS 完全失效。
