Search within TutorialsPark

CSS opacity Property

To make an element translucent or invisible

Definition and Notes.

1. The CSS opacity property allows you to specify the degree of opacity using a number between 0 and 1.Values outside this are set to their nearest number(0 or 1)

2. The opacity property is applicable to the element as well as it descendent, even though the value is not inherited by child elements.


CSS opacity property. internetexplorer safari firefox opera chrome

View in Splitscreen»


Note- The value of 0 is complete transparent and 1 is fully opaque

Property Values

Value Description
<number> A number between 0 to 1 to denote the opacity value. Values outside this range are rounded off to their nearest edge(0 or 1)
inherit The child element inherits the value of opacity from the parent element


Specs Value
Name opacity
Value <number> | inherit
Initial Value 1
Applies to all elements
Javascript syntax
Inherited No
Computed Value Same as declared value, rounded off to the nearest edge if outside the range
Browser Support internetexplorer safari firefox opera chrome

Related Examples.