HTML5系列代码：RGBA半透明效果CSS 中的颜⾊有三种定义⽅式：使⽤颜⾊⽅法（RGB、RGBA、HSL、HSLA），⼗六进制颜⾊值和预定义的颜⾊名称。
RGBA 是代表Red（红⾊） Green（绿⾊） Blue（蓝⾊）和 Alpha（不透明度）三个单词的缩写。RGBA 颜⾊值是 RGB 颜⾊值的扩展，带有⼀个 alpha 通道 - 它规定了对象的不透明度。
基本语法:
  R：红⾊值。正整数 （0~255）
  G：绿⾊值。正整数 （0~255）
  B：蓝⾊值。正整数（0~255）
  A：透明度。取值0~1之间
浏览器的兼容性：html代码转链接
RGBA 颜⾊值得到以下浏览器的⽀持：IE9+、Firefox 3+、Chrome、Safari 以及 Opera 10+。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>RGBA半透明效果</title>
<style type="text/css">
ul {
list-style:none;
margin:10px;
padding:0;
background:url(../images/charactor.png)10px 0 no-repeat;
}
li {height:20px;}
li:nth-child(1){background:rgba(255,153,0,0.1);}
li:nth-child(2){background:rgba(255,153,0,0.2);}
li:nth-child(3){background:rgba(255,153,0,0.3);}
li:nth-child(4){background:rgba(255,153,0,0.4);}
li:nth-child(5){background:rgba(255,153,0,0.5);}
li:nth-child(6){background:rgba(255,153,0,0.6);}
li:nth-child(7){background:rgba(255,153,0,0.7);}
li:nth-child(8){background:rgba(255,153,0,0.8);}
li:nth-child(9){background:rgba(255,153,0,0.9);}
li:nth-child(10){background:rgba(255,153,0,1);}
</style>
<body>
<ul>
<li></li><li></li><li></li><li></li><li></li>
<li></li><li></li><li></li><li></li><li></li>
</ul>
</body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。