What is the difference between opacity and alpha (rgba)?

Question

div { background-color: rgb(255,0,0); opacity: 1; } div { background-color: rgba(255,0,0,1); } 

What is the difference between the two?

Answer 1

Opacity sets the opacity value for an element and all its children; So far, RGBA sets the opacity value for only one ad.

This is well explained here. http://www.css3.info/introduction-opacity-rgba/

Answer 2

Opacity: The opacity property sets the opacity level for the element. (Setting opacity for elements makes the entire element transparent, including its contents.)

Opacity Definition:

 element{opacity:0.5} //makes the element and it content 50% transparent 

The opacity level describes the level of transparency, where 1 is not transparent at all, 0.5 - 50% is transparent, and 0 is completely transparent.

Alpha channel RGBA color values ​​are an extension of RGB color values ​​with an alpha channel that determines the opacity of an object. Background : rgba (Red,Green,Blue,Opacity) (Setting the rgba element only makes the background element transparent, leaving its contents as they are.)

Rgba: background definition:

 element{ background:rgba(40, 41, 42, 0.5); } 

The RGBA color value is indicated by: rgba (red, green, blue, alpha). The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque).

To convert the hexadecimal color value to rgb: Here

Additional Information:

RGBA color values ​​are supported in IE9 +, Firefox 3+, Chrome, Safari, and Opera 10+.

Answer 3

when you use alpha, you set opacity only for this div property. This way, only the background will be slightly transparent if you set the alpha value to .5

However, when you set the opacity to .5, the ENTIRE div and everything inside it remains slightly transparent, regardless of what alpha elements in the div have.

Within a div with opacity set to .5, the element will have a max. 5 "opaque (when its alpha value is 1). If its alpha value is set to .5, transparent affect will be complex, and in fact it will be that something like ".25" transparent. Not sure about specific numbers.