CSS3 透明属性 RGBA 和 opacity

面试官问我RGBA 和 opacity  都能实现透明效果，有什么不同？自己很自信的跟面试官说，是表示两种透明效果，opacity是css3的属性，ie低版本不支持，ie支持RAGB透明效果。之后总结问题时意识到自己答非所问，哎~~~~~尴尬死了。

opacity 是元素透明，而子元素也都透明，如：div在红色背景透明度为0.5，可是div里的文字也变得透明，为解决这个办法，自己还找特意度娘记了笔记的，解决办法就是用RGAB实现透明效果，只改变元素本身的透明效果，文字没有变透明。现在想起来真的很羞愧啊，真想找个缝钻进去。我就在博客中总结出来，看下次还忘不忘！

下面好总结一下，rgba和opacity的区别：  

先看代码：.rgba{background: rgba(255,0,0,0.5);}
.opacity{background: red;opacity: 0.5;}

效果如图：

讲解语法：

RGBA取值：

R：红色值。正整数 || 百分比；

G：绿色值。正整数 || 百分比；

B：蓝色值。正整数 || 百分比；

A：ALpha透明度。取值0-1之间。alpha数值为0时，那该元素就是完全透明的但是可以看到该元素下的元素，数值为1时该元素完全不透明。

正整数：0-255之间的任意数值，百分数为0%-100%之间的任意数值。

opacity取值： value || inherit

value取值范围：0-1；取值为0时完全透明，该元素下的子元素也是透明。取值为1时完全不透明。

注：IE8以及更早的版本支持用filter（ie滤镜）属性。例如：filter:Alpha(opacity=60)。

总结：

opacity会继承父元素的opacity属性,而RGBA设置的元素的后代不会继承该属性及属性值。