本章介绍css透明度 rgba，通过 rgba 属性可以设置颜色的透明度。设置图片的透明度可以使用css透明度 opacity。

语法格式

rgba(R,G,B,A)

rgba有4个参数，分别是：

  •  R：红色值。正整数 （0~255）
  •  G：绿色值。正整数 （0~255）
  •  B：蓝色值。正整数（0~255）
  •  A：透明度。取值0~1之间
也就是说rgba的第四个参数是用来设置透明度的，其中A的值越小越透明。

例子

下面介绍rgba的简单例子来说明它的用法。

<!DOCTYPE html>
<html>
<head>
	<title>css透明度 rgba</title>
<style>
	.fl{float:left;margin-left:10px;}
	.box{width:100px;height:100px;}
	.a1{background: rgba(255,255,0,1);}
	.a2{background: rgba(255,255,0,0.4);}
	.a3{background: rgba(255,255,0,0.2);}
</style>
</head>
<body>
<div class="fl">
	<p>无透明度</p>
	<div class="box a1"></div>
</div>
<div class="fl">
	<p>透明度0.4</p>
	<div class="box a2"></div>
</div>
<div class="fl">
	<p>透明度0.2</p>
	<div class="box a3"></div>
</div>
</body>
</html>
输出效果

css透明度 rgba