Opacity Effects

Opacity effects, introduced in CSS3, allow you to change the transparency of HTML elements using the opacity property. Using these effects, you can change the opacity of almost every element of an HTML document, such as buttons, text, or images.

The following code snippet shows an example of using the opacity property:

img{ opacity:0.6; }

In the preceding code snippet, we have set the opacity of the IMG element to 0.6, i.e. 60%. It means that the element gets transparent by 60%. You can change the transparency of any HTML element by changing its opacity property.

Click here for demos to see opacity effects:
demo 1
demo 2