HTML and CSS Reference
In-Depth Information
The
transparent
color keyword represents a color value that is fully
transparent (and thus red channel or hue designations don't matter).
You can think of it as a shorthand form for (and gets computed in
browsers as)
rgba(0,0,0,0)
.
rgba()
and
hsla()
Colors with
Non-CSS3 Browsers
Colors units with alpha channels are supported in recent versions of
Safari, Firefox, Opera, and the upcoming IE9. Browsers that don't sup-
port these units will skip them entirely because the
rgba()
or
hsla()
notation is as foreign to them as
madeupscheme()
is. This means if
you defined an element's background to be “blue but a little trans-
parent,” the browser will not fall back to “blue but not transparent”
and instead use whatever the previously defined or inherited color
may be. If you want the fallback to be “blue but not transparent,” you
can write the rule set as follows:
div {
background-color:
rgb
(0,0,255);
background-color:
rgba
(0,0,255,90%);
}
All browsers will read the first
background-color
declaration.
Browsers with
rgba()
support will then override that setting with
the second declaration, while others will ignore it as invalid syntax.
As a variation on this method, if your layout calls for transparent red
against white, resulting in a pink color, you might use that resulting
color in the first declaration instead of a deeper red.
