rgba和 opacity的异同

rgba和 opacity都是用于是页面透明的属性。

rgba()表示 红 绿 蓝 alpha ,W3C指在原有的rgb颜色模型之后增加了 “alpha”参数，“可以让制定的颜色透明化”（rgb()上扩展的，其只可以设置颜色，而不能使设置的颜色透明化）。

例子：rgba(55,146,179,.5) ; //rgb值为“55,146,179”，.5使设定的rgb值为50%透明,1为完全不透明，0为完全透明

opacity属性是css3的属性，也可以实现透明效果

例子：opacity:.65; //1为完全不透明，0为完全透明

rgba()和opacity都能实现透明效果，但最大的不同是opacity作用于元素，以及元素内的所有内容的透明度，

而rgba()只作用于元素的颜色或其背景色

两种都不被IE支持(IE9开始支持)

不禁联想到之前做透明效果的按钮时的体验，那时候一直用的是opacity，导致里面的文字也会呈现出一定程度的透明。真正合适的处理方式是按钮的背景使用rgba，就能达到背景透明，而文字不受影响。