The background-color
property sets the background color of an element.
The background-image
property sets an image as the background of an element.
The background-repeat
property controls whether a background image repeats. It can be set to repeat
, no-repeat
, repeat-x
, or repeat-y
.
The background-position
property specifies the starting position of a background image. Common values include center
, top
, bottom
, left
, and right
.
The background-size
property sets the size of the background image. Values include cover
, contain
, or specific dimensions like 100px 100px
.
The background-attachment
property sets whether a background image scrolls with the page (scroll
) or stays fixed (fixed
).
You can combine multiple background properties in one shorthand property. For example:
background: url('image.jpg') no-repeat center/cover fixed;
This shorthand combines background-image
, background-repeat
, background-position
, background-size
, and background-attachment
.