带有阿尔法通道的颜色的十六进制表示?

对于如何以十六进制格式表示颜色(包括 alpha 通道) ,是否有 W3或其他值得注意的标准?

是 # RGBA 还是 # ARGB?

103086 次浏览

我不确定是否有官方标准

RGBA 是我在 Web 上看到的代表 Macromedia 等使用 ARGB

我相信 RGBA 是更常见的代表。

如果有帮助,这是从 W3的 CSS3
Http://www.w3.org/tr/css3-color/#rgba-color

编辑 (Patrick) : 引用上面的 W3链接

与 RGB 值不同,RGBA 值没有十六进制表示法

似乎没有十六进制 alpha 格式: http://www.w3.org/TR/css3-color/

无论如何,如果你使用像 SASS 这样的 CSS 预处理器,那么你可以传递一个十六进制到 rgba: 背景:

rgba(#000, 0.5);

预处理器只是将十六进制代码自动转换为 rgb。

您可以尝试将十六进制颜色放入 GIMP 或照片商店的颜色选择器中以获得 RGB 值,然后使用 alpha 值。红色是 #FF0000或者 rgb(255,0,0)如果你想要一个阿尔法值为.5的红色,那么 rgba(255,0,0,.5)

也许不是你想要的,但希望能有所帮助。

在 CSS3中,引用规范中的话,“ RGBA 值没有十六进制表示法”(参见 CSS 三级规范)。相反,您可以使用带有小数或百分比的 rgba ()函数表示法,例如 rgba (255,0,0,0.5)将是50% 透明的红色。RGB 通道是0-255或0%-100% ,alpha 是0-1。

在 CSS 颜色级别4中,可以使用8位十六进制颜色的第7和第8个字符或4位十六进制颜色的第4个字符指定 alpha 通道(参见 色彩模块4级规范 *)

截至2022年7月,95% 以上的用户可以理解 # RGBA 格式

它得到支持的原因是:

  • 2016年9月发布的 Firefox 49(Mozilla bug 567283)。
  • Safari 10,2016年9月发布。
  • Chrome62,发布于2017年10月。对于较早的版本,您可以启用实验性的 Web 特性来使用这种语法。参见 铬问题618472Webkit bug 150853
  • Opera 52,发布于2018年3月(或者 Opera 39,当实验性的网络功能被启用时)。
  • Edge 79,发布于2020年1月(基于 Chromium 的 Edge 的第一个版本)
  • 三星互联网8.2,发布于2018年12月
  • Android P (你的应用程序必须针对 Android P 或更新版本)

以下内容不支持:

  • IE
  • 原始边缘(版本号不超过18和包括18)
  • 迷你歌剧
  • UC 浏览器

最新的浏览器支持信息是 请登陆 CanIUse.com

Chrome 52 + 支撑物 alpha 十六进制:

background: #56ff0077;

对于老版本的浏览器,你必须使用:

background-color: rgba(255, 220, 0, 0.3);