Style opacityProperty
Example
Make a DIV element semi-transparent:
document.getElementById("myDIV").style.opacity="0.5";
Try it Yourself »
Definition and Usage
The opacity property sets or returns the opacity of an element.
The opacity level of an element describes the transparency level. When the opacity is 1, it is fully opaque; when the opacity is 0.5, it is semi-transparent; when the opacity is 0, it is fully transparent.
Browser Support
![]()
All major browsers support the opacity property.
Note:IE8 and earlier versions support an alternative property, namely the filter property.
Syntax
Return the opacity property:
object.style.opacity
Set the opacity property:
object.style.opacity="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. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default value: | 1 |
|---|---|
| Return value: | A string, representing the element's opacity property. |
| CSS Version | CSS3 |
Related Articles
CSS Reference:opacity property
Other Extensions
Style Object