HTML DOM Element style
Examples
Change the color of "myH1":
document.getElementById("myH1").style.color = "red";
Try it Yourself »
Get the value of a "myP"s top-border:
let value = document.getElementById("myP").style.borderTop;
Try it Yourself »
Definition and Usage
The style property returns the values of an element's style attribute.
The style property returns a CSSStyleDeclaration object.
The CSSStyleDeclaration object contains all inline styles properties for the element.
It does not contain any style properties set in the <head> section
or in any external style sheets.
Note 1
You cannot set a style like this:
element.style = "color:red";
Note 2
JavaScript syntax is slightly different from CSS syntax:
backgroundColor / background-color.
See our Full Style Object Reference.
Note 3
Use this style property instead of the The setAttribute() Method, to prevent overwriting other properties in the style attribute.
See Also:
Syntax
Return a style property:
element.style.property
Set a style property:
element.style.property = value
Return Value
| Type | Description |
| value |
The value of the specified property. For example: element.style.borderBottom = "2px solid red" |
Return Value
| Type | Description |
| Object | The element's CSSStyleDeclaration object. |
Browser Support
element.style is a DOM Level 2 (2001) feature.
It is fully supported in all browsers:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | 9-11 | Yes | Yes | Yes | Yes |
