Style backgroundColor Property

Definition and Usage

backgroundColor Sets or returns the background color of the element.

See also:

HTML Styles:background property

CSS Tutorial:CSS baggrund

CSS Reference Manual:background-color property

Instance

Example 1

Sets the background color of the document:

document.body.style.backgroundColor = "red";

Try it yourself

Example 2

Sets the background color of the specific <div> element:

document.getElementById("myDiv").style.backgroundColor = "lightblue";

Try it yourself

Example 3

Returns the background color of the specific <div> element:

alert(document.getElementById("myDiv").style.backgroundColor);

Try it yourself

Example 4

Returns the background color of the document:

alert(document.body.style.backgroundColor);

Try it yourself

Syntax

Returns the backgroundColor property:

object.style.backgroundColor

Sets the backgroundColor property:

object.style.backgroundColor = "color|transparent|initial|inherit"

Property value

Value Description
color

Specifies the background color.

See CSS color valuesfor a complete list of possible color values.
transparent Default. The background color is transparent (the underlying content will show through).
initial Sets this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Technical details

Default value: transparent
Return value: A string that represents the background color.
CSS version: CSS1

Browser support

backgroundColor It is a CSS1 (1996) feature.

All browsers fully support it:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Support Support Support Support Support Support