rgba在css3的含义是什么

106 阅读 0 评论 70 点赞

我是靠谱客的博主温婉黑米，最近开发中收集的这篇文章主要介绍rgba在css3的含义是什么，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

本教程操作环境：windows10系统、CSS3&&HTML5版本、Dell G3电脑。

rgba在css3的含义是什么

RGB 是代表Red（红色）、Green（绿色）、 Blue（蓝色）三个单词的缩写。RGBA 颜色值是 RGB 颜色值的扩展，添加了一个 alpha 通道，它规定了对象的不透明度。

RGBA 即红色、绿色、蓝色、透明度（英语：Red, Green, Blue、Alpha）。

红色（R）0 到 255 间的整数，代表颜色中的红色成分。。
绿色（G）0 到 255 间的整数，代表颜色中的绿色成分。
蓝色（B）0 到 255 间的整数，代表颜色中的蓝色成分。
透明度（A）取值 0~1 之间，代表透明度。

语法为;

rgba(red, green, blue, alpha)
登录后复制

示例如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
#p1 {background-color:rgba(255,0,0,0.3);}
#p2 {background-color:rgba(0,255,0,0.3);}
#p3 {background-color:rgba(0,0,255,0);}
#p4 {background-color:rgba(192,192,192,0.3);}
#p5 {background-color:rgba(255,255,0,0.3);}
#p6 {background-color:rgba(255,0,255,0.3);}
</style>
</head>
<body>
<p>RGB 颜色，并使用透明度:</p>
<p id="p1">红色</p>
<p id="p2">绿色</p>
<p id="p3">蓝色</p>
<p id="p4">灰色</p>
<p id="p5">黄色</p>
<p id="p6">樱桃色</p>
</body>
</html>
登录后复制

输出结果：