CSS `background-color` Property

Example

Set background colors for different elements:

body
{
    background-color: yellow;
}
h1
{
    background-color: #00ff00;
}
p
{
    background-color: rgb(255,0,255);
}

The background-color property sets the background color of an element.

The background of an element is the total size of the element, including padding and border (but not the margin).

Default value:	transparent
Inherited:	no
---	---
Version:	CSS1
---	---
JavaScript syntax:	`object.style.backgroundColor="#00FF00"`
---	---

The numbers in the table specify the first browser version that fully supports the property.

The number preceding -webkit-, -ms-, or -moz- specifies the first browser version that supports the prefixed property.

Property
background-color	1.0	4.0	1.0	1.0	3.5

All major browsers support the background-color property.

Note: IE7 and earlier do not support the "inherited" value. IE8 requires a defined !DOCTYPE. IE9 supports "inherited".

Tip: Use a background color and text color that makes the text easy to read.

Value	Description
color	Specifies the background color. In CSS color values
transparent	Specifies that the background color should be transparent. This is default
inherit	Specifies that the background color should be inherited from the parent element