CSS background-image Property
Description
The background-image property sets the background image(s) of an element. Images are drawn with the first specified one on top (closest to the user) and each subsequent image behind the previous one.
- Initial value
- none
- Applies to
- All elements
- Inherited
- No
- Media
- Visual
- Computed value
- As specified, but with URIs made absolute
- Animatable
- No
- CSS Version
- CSS1, CSS2, CSS3
- JavaScript syntax
- object.style.backgroundImage
Syntax
Formal syntax: <bg-image> [ , <bg-image> ]*
background-image: none;
background-image: url("images/img.png");
Values
<bg-image> = <image> | none- <image>Is an <image> denoting the image to display. There can be several of them, separated by commas, as multiple backgrounds are supported.
- noneColor of the next parent through which the background is visible.
- inherit
Example
.class {
background-image: url(img/myimage.jpg);
}Give it a Try
Click the button below to experiment with this property.
Browser Support
| Desktop | |||||
 |
 |
 |
 |
 |
 |
| 4 | 12 | 1 | 1 | 3.5 | 1 |
| Tablets / Mobile | |||||
 |
|
|
|
|
 |
| ≤37 | 18 | 4 | Yes | 1 | Yes |