CSS3中rgba颜色用法及opacity细微区别

经常做前端开发的人都知道网页上的颜色可以用rgb(red,green,blue)，和WEB色值如#3498db来表示。例如菠菜园经常用到的网页配色是以下几种：

但是在实际开发过程中有了单纯的颜色并不一定满足我们的开发需求，所以有时候也需要我们把某些颜色做透明处理，所以我们也经常这样写代码：

我们可以用opacity对整个元素进行半透明处理。当然也包含元素上面的文字。所以opacity属性可以很方便的适用在整个元素半透明处理的地方。

RGBA是什么？

关于RGBA的专业解释很多，菠菜园从第一篇文章开始就说了，咱们的文章全部采用白话的方式，如果需要专业解释大家可以百度一下。R代表RED，G代表GREEN，B代表BLUE，A代表Alipha颜色空间，我们不用去想颜色空间是什么，简单的理解成透明处理就行了。

有了RGBA处理颜色就灵活多了，比如我们写一个button标签，我们可以单纯的为button标签的背景色增加半透明效果，而不影响button上面文字的清晰度。示例代码如下：