rgba for background color of IE7&IE8

RGB color mode (also translated as "red, green and blue", rarely used) is a color standard in the industry. It is used to obtain various colors through the changes of red (R), green (G) and blue (B) color channels and their superposition. RGB It is the color representing the three channels of red, green and blue. This standard covers almost all colors that can be perceived by human vision. It is one of the most widely used color systems at present.

RGBA controls alpha more than RGB transparent The parameter of degrees. For the above three parameters R, G and B, the value range of positive integer value is 0– 255。 Value range of percentage value: 0.0%– 100.0%。 The value out of range will be up to its nearest value limit. Not all browser Both support the use of percentage values. Parameter A, value between 0 and 1, cannot be negative

RGBA syntax:

1. div {

2. background : rgba ( zero , zero , zero , zero point five );

3. }

Browser compatible Sex:

Differences between RGBA and efficiency
Opacity (filter: Alpha (Opacity=50) or Opacity: 0.5) will make the entire element including child elements transparent, while RGBA is just the element itself transparent, and child elements opaque.

The following details how to make IE browser support RGBA color
1、 CSSPIE
CSSPIE enables color, background and box shadow to support RGBA
Example:

1. div {

2. color : rgba ( zero , zero , zero ,. five );

3. background : rgba ( zero , zero , zero ,. five );

4. - pie - background : rgba ( zero , zero , zero ,. five ); /* IE6 -8*/

5. box - shadow : 1px 1px rgba ( zero , zero , zero ,. five ); /*Support rgba only when no ambiguity value is set*/

6. }

2、 Filter
Make the background color transparent through IE filter to simulate the rgba effect without affecting the background transparency of sub elements
Example:

1. . filter {

2. filter : progid : DXImageTransform . Microsoft . gradient ( startColorstr = #BF000000,endColorstr=#BF000000);

3. }

We need to pay attention to the values of StartColorStr and EndColorStr. The first two digits are hexadecimal transparency, and the last six digits are hexadecimal colors.
Conversion method: x=alpha * 255, convert the calculated result x into hexadecimal

1. Load PIE.js on your web page.

Note: Use IE specific comments to prevent non IE browsers from downloading.

<!--[if lt IE 10]>

<script type="text/javascript" src="PIE.js"></script>

<![endif]-->

 

2. Call with js:

$(function() {

    if (window.PIE) {

        $('.rounded').each(function() {

            PIE.attach(this);

        });

    }

});