Getting Started
Setting Foreground and Background Colors
Background Properties
CSS properties allow authors to specify the foreground color and background of an element.
Background
| Syntax: | background: <value> |
|---|---|
| Possible Values: | <background-color> || <background-image> || <background-repeat> || <background-attachment> || <background-position> |
| Initial Value: | Not defined |
| Applies to: | All elements |
| Inherited: | No |
The background property is a shorthand for the more specific background-related properties. Some examples of background declarations follow:
BODY { background: white url(http://www.htmlhelp.com/foo.gif) }
BLOCKQUOTE { background: #7fffd4 } P
{ background: url(../backgrounds/pawn.png) #f0f8ff fixed } TABLE
{ background: #0c0 url(leaves.jpg) no-repeat bottom right }
A value not specified will receive its initial value. For example, in the first three rules above, the background-position property will be set to 0% 0%.
To help avoid conflicts with user style sheets, background and color properties should always be specified together.
Color
| Syntax: | color: <color> |
|---|---|
| Initial Value: | Determined by browser |
| Applies to: | All elements |
| Inherited: | Yes |
The color property allows authors to specify the color of an element. See the Units section for color value descriptions. Some example color rules include:
H1 { color: blue } H2 { color: #000080 } H3 { color: #0c0 }
To help avoid conflicts with user style sheets, background and color properties should always be specified together.
Background Color
| Syntax: | background-color: <value> |
|---|---|
| Possible Values: | <color> | transparent |
| Initial Value: | transparent |
| Applies to: | All elements |
| Inherited: | No |
The background-color property sets the background color of an element. For example:
BODY { background-color: white } H1 { background-color: #000080 }
To help avoid conflicts with user style sheets, background-image should be specified whenever background-color is used. In most cases, background-image: none is suitable.
Authors may also use the shorthand background property, which is currently better supported than the background-color property.