CSS Transparency: The Opacity Property
Brown on Darksalmon
CSS Opacity Example
color:brown with background:white
What color do we use for a background?
For the pullquote area we are using background:white.
Why white? The pullquote area that is darksalmon will be blended with 20% white. We start with an an opacity of 20%. The filter:alpha(opacity=20) is the syntax for Internet Explorer while -moz-opacity:0.2 is the syntax for Mozilla. Anything we put in the div is set to transparent. The result is that the white background will blend with the display of the child element. That means that if our page background is darksalmon then the pullquote area that is darksalmon will be blended with 20% white. The full effect looks like this.
Brown Text with White Background
It is necessary to set the background to a color for Internet Explorer (IE).
We are using the color named white. The desired opacity effect is achieved in Mozilla and IE.
Copy and paste this in your Blog or Web page.
That's the code in its entirity. It will look like this.
Color:Brown with Background:White
Here we are starting out with an opacity of 20%.
The filter:alpha(opacity=20) is the syntax for Internet Explorer while -moz-opacity:0.2 is the syntax for Mozilla. Anything we put in the div is set to transparent so the white background will white background will blend with the display of the child element. That means that if our page background is darksalmon then the pullquote area that is darksalmon will be blended with 20% white. The full effect looks like this.
Brown Text with White Background
The result is best in Internet Explorer
when a background color is defined.
The desired opacity effect is achieved in
Mozilla and IE.