Rgba compatibility processing and rgba compatibility

Rgba compatibility processing and rgba compatibility

According to caniuse (http://caniuse.com/#search=rgba), rgba compatibility is IE9 and above.

 

Instance code:

1 <! Doctype html> 2 
Chrome browser effect:

 
IE8 browser effect (no background ):
Rgba compatibility processing:
1. parent {2 width: 400px; 3 height: 400px; 4 margin: 100px; 5 font-size: 20px; 6 color: # FF0000; 7 border: 1px solid red; 8 background: rgba (0, 0, 0, 0.5); 9/* next key setting */10 filter: progid: DXImageTransform. microsoft. gradient (startcolorstr = #7f000000, endcolorstr = #7f000000); 11}
Set the filter attribute to execute when the transparency of the last row does not work. filter: progid: DXImageTransform. microsoft. gradient is used for gradient, but this place does not need gradient, so both colors are set to the same color.
The color "#7f000000" is composed of two parts.
The first part is the 7f behind. Is the IEfilter value of rgba transparency 0.5. Each number from 0.1 to 0.9 corresponds to an IEfilter value. The relationship is as follows:

That is, the value obtained from alpha * 255 can be converted to hexadecimal.
The second part is the six-digit color value after 7f, which is the same as the value in the rgb function. For example, the value corresponding to # ffffff in rgb (255,255,255.
 
Conclusion: This completes IE8 and later iebrowser RGBA compatibility.