首页 > WEB开发 > CSS

css 使用RGBA 设置颜色【CSS3.0参考手册】

可以使用rgba来设置背景颜色的透明度,如果rgba最后一个参数设置为0那么就是背景颜色是透明的。

语法:

R:红色值。正整数 | 百分数

G:绿色值。正整数 | 百分数

B:蓝色值。正整数 | 百分数

A:透明度。取值0~1之间

取值:

<length>
Hue(色调)。 0(或360)表示红色,120表示绿色,240表示蓝色,当然可取其他数值来确定其它颜色;
<percentage>
Saturation(饱和度)。 取值为0%到100%之间的值;
<percentage>
Lightness(亮度)。 取值为0%到100%之间的值;
<opacity>
alpha(透明度)。 取值在0到1之间;

说明:

RGB色彩模式(也翻译为“红绿蓝”,比较少用)是工业界的一种颜色标准,是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的,RGB即是代表红、绿、蓝三个通道的颜色,这个标准几乎包括了人类视力所能感知的所有颜色,是目前运用最广的颜色系统之一。

RGBA在RGB的基础上多了控制alpha透明度的参数。以上R、G、B三个参数,正整数值的取值范围为:0 - 255。百分数值的取值范围为:0.0% - 100.0%。超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。A参数,取值在0~1之间,不可为负值。

兼容性:

类型 Internet Explorer Firefox Chrome Opera Safari
版本 (×)IE6 (√)Firefox 3.0.10 (√)Chrome 2.0.x (√)Opera 9.64 (√)Safari 4
(×)IE7 (√)Firefox 3.5      
(×)IE8        
         

实例:

css 使用RGBA 设置颜色【CSS3.0参考手册】

代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css  使用rgba 设置颜色</title>

</head>
<body>

<div style="background-color: rgba(0,0,0,0.5);">在chrome的浏览器里能看到alpha值为0.5的黑色背景</div>

</body>
</html>
来源://作者:/更新时间:2014-01-15
相关文章
评论:
验证码:
匿名评论: