Style opacity Property

Style Object Reference Style Object


Make a DIV element transparent:

document.getElementById("myDIV").style.opacity = "0.5";

Try it yourself »

Definition and Usage

The opacity property sets or returns the opacity level of an element.

The opacity-level of an element describes the transparency-level, where 1 is not transperant at all, 0.5 is 50% see-through, and 0 is completely transparent.

Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The opacity property is supported in all major browsers.

Note: IE8 and earlier supports an alternative, the filter property.


Return the opacity property:

Set the opacity property:"number|initial|inherit"

Property Values

Value Description
number Specifies the opacity. From 0.0 (fully transparent) to 1.0 (fully opaque)
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

Technical Details

Default Value: 1
Return Value: A String, representing the opacity-level of an element
CSS Version CSS3

Related Pages

CSS reference: opacity property

Style Object Reference Style Object