background-image
The background-image defines the background image of an element.
Syntax
background-image: url() | none;
We can set one or more background images of an element using a comma , separator.
Example
.div-1,
.div-2 {
border: 1px solid black;
height: 50px;
width: 500px;
}
.div-1 {
background-image: url("https://assets.about.me/background/users/s/c/a/scanskill_1653288947_518.jpg");
background-size: contain;
background-repeat: no-repeat;
}
.div-2 {
background-image: url("https://assets.about.me/background/users/s/c/a/scanskill_1653288947_518.jpg"), url("https://scanskill.com/wp-content/uploads/2022/02/cropped-Screen-Shot-2022-02-15-at-13.25.57-1.png");
background-size: contain;
background-repeat: no-repeat, repeat;
}
Property Values
url(): sets the background image from the source url provided. url can be from the image address or image path.
none: sets no background image. This is the default value.