CSS background egenskap
- Previous page backface-visibility
- Next page background-attachment
Definition och användning
background
Kortformade egenskaper kan användas för att ställa in alla bakgrundsegenskaper i en deklaration.
Följande egenskaper kan ställas in:
- background-color
- background-position
- background-size
- background-repeat
- background-origin
- background-clip
- background-attachment
- background-image
Om ingen av dessa värden är inställda, kommer det inte att bli något problem, till exempel background:#ff0000 url('smiley.gif'); är också tillåtet.
It is usually recommended to use this property instead of using individual properties separately, as this property is better supported in older browsers and requires fewer letters to be typed.
See also:
CSS Tutorial:CSS bakgrund,CSS Background (Advanced)
HTML DOM Reference Manual:background property
Example
How to set all background properties in one declaration:
body { background: #00FF00 url(bgimage.gif) no-repeat fixed top; }
CSS syntax
background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
Attribute value
Value | Description | CSS |
---|---|---|
background-color | Specifies the background color to be used. | 1 |
background-position | Specifies the position of the background image. | 1 |
background-size | Specifies the size of the background image. | 3 |
background-repeat | Specifies how the background image is repeated. | 1 |
background-origin | Specifies the positioning area of the background image. | 3 |
background-clip | Specifies the drawing area of the background. | 3 |
background-attachment | Specifies whether the background image is fixed or scrolls with the rest of the page. | 1 |
background-image | Specifies the background image to be used. | 1 |
inherit | Specifies that the background property settings should be inherited from the parent element. | 1 |
Technical details
Default value: | not specified |
---|---|
Inheritance: | no |
Version: | CSS1 + CSS3 |
JavaScript syntax: | object.style.background="white url(paper.gif) repeat-y" |
Browser support
The numbers in the table indicate the first browser version that fully supports this property.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
- Previous page backface-visibility
- Next page background-attachment