Opacity : The opacity property sets the opacity level for an element. (Setting opacity for an elements makes the whole element transparent including its content.) The opacity-level describes the transparency-level, where 1 is not transparant at all, 0.5 is 50% see-through, and 0 is completely transparent.

When adding transparency styles What is the difference between using the opacity?

Opacity is a measure of how opaque an item is and transparency is a measure of how transparent it appears. Both work nearly the same way but at 100% transparent, the element will be completely invisible, while with the opacity set to 100% it be fully visible.

What is difference between rgba and opacity?

The primary difference is, the opacity applies to its sub-elements too. In contrast, rgba() applies the transparency of the colour to that particular element only. For example, opacity is set to the div element that contains text and has a border.