CSS Reference
CSS Reference CSS Selectors CSS Reference Aural CSS Web Safe Fonts CSS Units CSS Colors CSS Color Values CSS Color Names CSS Color HEX CSS3 Browser SupportCSS Properties
CSS background Property
Example
Set all the background properties in one declaration:
body
{
background: #00ff00 url('smiley.gif') no-repeat fixed center;
}
{
background: #00ff00 url('smiley.gif') no-repeat fixed center;
}
Try it yourself »
Browser Support
The background property is supported in all major browsers.
Note: IE8 and earlier do not support multiple background images on one element.
Note: The value "inherit" is not supported in IE7 and earlier. IE8 requires a !DOCTYPE. IE9 supports "inherit".
Definition and Usage
The background shorthand property sets all the background properties in one declaration.
The properties that can be set, are: background-color, background-position, background-size, background-repeat, background-origin, background-clip, background-attachment, and background-image.
It does not matter if one of the values above are missing, e.g. background:#ff0000 url(smiley.gif); is allowed.
| Default value: | see individual properties |
|---|---|
| Inherited: | no |
| Version: | CSS1 + new properties in CSS3 |
| JavaScript syntax: | object.style.background="red url(smiley.gif) top left no-repeat" |
Syntax
background: color position size
repeat origin clip attachment
image;
| Value | Description | CSS |
|---|---|---|
| background-color | Specifies the background color to be used | 1 |
| background-position | Specifies the position of the background images | 1 |
| background-size | Specifies the size of the background images | 3 |
| background-repeat | Specifies how to repeat the background images | 1 |
| background-origin | Specifies the positioning area of the background images | 3 |
| background-clip | Specifies the painting area of the background images | 3 |
| background-attachment | Specifies whether the background images are fixed or scrolls with the rest of the page | 1 |
| background-image | Specifies ONE or MORE background images to be used | 1 |
Related Pages
CSS tutorial: CSS Background
CSS3 tutorial: CSS3 Backgrounds
HTML DOM reference: background property
Your suggestion:
Close [X]
Thank You For Helping Us!
Your message has been sent to W3Schools.
Close [X]
