background-repeat property defines how background images are repeated.
A background image can be repeated along the horizontal axis, the vertical axis, both axes, or not repeated at all.
By default, a background image is repeated both vertically and horizontally.
Note: The background image is placed according to the background-position property. If no background-position is specified, the image is always placed at the element's top left corner.
|Applies to||all elements|
|Computed value||as specified|
|Animatable||no See animatable properties.|
Repeat a background image only horizontally:
Repeat a background image both vertically and horizontally (This is default):
Repeat a background image only vertically:
Do not repeat a background image:
The numbers in the table specify the first browser version that fully supports the
The following table describes the values of
|repeat||The background image will be repeated both vertically and horizontally (This is default)|
|repeat-x||The background image will be repeated horizontally only|
|repeat-y||The background image will be repeated vertically only|
|no-repeat||The background image will not be repeated|
|space||The background-image is repeated as much as possible without clipping. The first and last images are pinned to either side of the element, and whitespace is distributed evenly between the images|
|round||The background image is repeated and squished or stretched to fill the space (no gaps)|
|initial||Sets this property to its default value|
|inherit||Inherits this property from its parent element|
CSS Background tutorial
CSS background property
CSS background-image property
CSS background-attachment property
CSS background-position property