The purpose needs, need a background translucent effect, then immediately think of "Opacity:0.5″ and so on, for compatibility with IE may also use filter, such as:
Filter:alpha (OPACITY=50); -moz-opacity:0.50; opacity:0.50;
The above is can achieve translucent effect, but will affect the inside of the sub-element is also translucent, such as the text inside the div is translucent, this is not what I want
The English google.com read half a day, a little summary and modification, finally Kung fu is not negative, realized can be compatible with each browser, to achieve the background color translucent without affecting the child elements of the code, as follows:
Background:rgba (0,0,0,0.6); background:transparent\9;zoom:1\8; /* required for the filters */-ms-filter: "Progid:DXImageTransform.Microsoft.gradient (startcolorstr= #99000000, Endcolorstr= #99000000) "; /* IE8 */filter:progid:dximagetransform.microsoft.gradient (startcolorstr= #99000000, endcolorstr= #99000000); /* ie5.5-7 */
The above code takes advantage of the translucent effect of RGBA and uses filter for compatibility with IE.
Note: The method here is only for the background color , for the background image translucent does not apply, the background image translucent can be used transparent PNG pictures!
Use Rgba and filter to set CSS background color translucent without affecting child elements, compatible with ie6-8