CSS background-repeat Property

« Previous

Complete CSS Reference

Example

Repeat a background-image only vertically:

body {
background-image: url("paper.gif");
background-repeat: repeat-y;
}

Try it yourself »

More "Try it Yourself" examples below.

Definition and Usage

The background-repeat property sets if/how a background image will be repeated.

By default, a background-image is repeated both vertically and horizontally.

Tip: 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.

Default value:	repeat
Inherited:	no
Animatable:	no. Read about animatable
Version:	CSS1
JavaScript syntax:	object.style.backgroundRepeat="repeat-x" Try it

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
background-repeat	1.0	4.0	1.0	1.0	3.5

Note: IE8 and earlier do not support multiple background images on one element.

CSS Syntax

Property Values

Value	Description	Play it
repeat	The background image will be repeated both vertically and horizontally. This is default	Play it »
repeat-x	The background image will be repeated only horizontally	Play it »
repeat-y	The background image will be repeated only vertically	Play it »
no-repeat	The background-image will not be repeated	Play it »
initial	Sets this property to its default value. Read about initial	Play it »
inherit	Inherits this property from its parent element. Read about inherit