前言
sdkfh
shdhfk
rgba与opacity的区别，其实说了无数次了，但是我自己在重复一次吧，多多益善。
开门见山
区别就是opacity会继承父元素的 opacity 属性，而rgba设置元素的后代元素不会继承不透明属性
opacity
语法
opacity: value|inherit;
value 取值0~1，0为完全透明，1为完全不透明。默认是继承父元素opacity属性，所以子元素会继承父元素的opacity属性值，从而产生相同的效果。
但是单独设置子元素opacity的值会产生单独的效果，前提是属性值小于等于父元素的属性值，否则修改无效，继承保持父元素的属性值。
<div class='box opacity'>
opacity
<div class='a'>opacity
<div class='b'>opacity</div>
</div>
</div>
// a、b的属性值都小于父元素，所以有效
.opacity{
opacity:.9;
}
.a{
opacity:.6;
}
.b{
opacity:.3;
}
//a、b的属性值都大于父元素，所以无效，保持和父元素一致
.opacity{
opacity:.5;
}
.a{
opacity:.8;
}
.b{
opacity:1;
}
rgba
语法
rgba(r,g,b,a)
rgba函数在rgb颜色模式基础上增加了alpha通道，alpha通道是不透明度，这样可以在设置颜色的同时去设置透明度。alpha取值在0~1之间。
设置rgba只会对元素本身产生影响，因为无法继承，所以不会对子元素产生影响。
<div class='rgba box'>rgba</div>
.rgba{
background-color:rgba(0,0,0,.5)
}
参考链接
