- HTML中文网
- 联系QQ：88526
- QQ交流群
- 微信公众号
前端控
更新时间：2019-03-21 14:26:32
RGBA(R,G,B,A)
RGBA记法
此色彩模式与RGB相同，只是在RGB模式上新增了Alpha透明度。
IE6.0-8.0不支持使用 rgba 模式实现透明度，可使用 IE 滤镜处理
示例代码：
filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr=#88000000, endColorstr=#88000000);
#88000000 的前两位数字控制透明度，取值16进制从00 -> FF（越小越透明），00表示完全透明，FF就是全不透明，后面六位是色值。
progid:DXImageTransform.Microsoft.Gradient()滤镜里的 startColorstr 参数值是 #AARRGGBB 形式的， 其中的AA是代表不透明
度的十六进制，00表示完全透明，FF就是全不透明，化成十进制的范围就是0~255，剩下的 RRGGBB 就是颜色的十六进制代码。
如：background: rgba(125, 0, 0, .3); 表示的是30%不透明度的红色背景。把30%的不透明度转换成十六进制的方法如下：先计算
#AA的的十进制x，x/255 = 3/10，解得x=3*255/10，然后再把x换算成十六进制，约等于4C。
.0（00） .1（19） .05（0C） .15（26） .2（33） .3（4C） .25（3F） .35（59） .4（66） .5（7F） .45（72） .55（8C） .6（99） .7（B2） .65（A5） .75（BF） .8（CC） .9（E5） .85（D8） .95（F2）
兼容性：
浅绿 = 支持
红色 = 不支持
粉色 = 部分支持
| IE | Firefox | Chrome | Safari | Opera | iOS Safari | Android Browser | Android Chrome |
|---|---|---|---|---|---|---|---|
| 6.0-8.0 | 2.0+ | 4.0+ | 3.1+ | 3.5+ | 3.2+ | 2.1+ | 18.0+ |
| 9.0+ |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
div{
width:450px;
height: 300px;
background-color: rgb(255, 0, 0,0.3);
}
</style>
</head>
<body>
<p>设置透明度为30%的红色</p>
<div></div>
</body>
</html>点击 "运行实例" 按钮查看在线实例
效果图：
推荐手册