CSS background-repeatProperty
Example
Only repeat the background-image in the vertical direction:
Try it Yourself »
Tag definition and usage instructions
Sets how the background-image property of an object is tiled.
By default, the background-image is repeated vertically and horizontally.
| Default Value: | repeat |
|---|---|
| Inherited: | no |
| version: | CSS1 |
| JavaScript Syntax: | object object.style.backgroundRepeat="repeat-y" |
Browser Support
The numbers in the table specify the first browser version that supports the property.
The number immediately preceding -webkit-, -ms-, or -moz- specifies the first browser version that supports the prefixed property.
<| Property | |||||
|---|---|---|---|---|---|
| background-repeat | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
IE8 and earlier browsers do not support multiple background images on one element.
NoteIE7 and earlier versions do not support the value of "inherit". IE8 requires a !DOCTYPE declaration. IE9 supports "inherit".
Tips and notes
Tip:The background-position property sets the position of the background image. If no position is specified, the image is always placed at the top-left corner of the element.
Property value
| Value | Description |
|---|---|
| repeat | The background image will be repeated vertically and horizontally. This is the default. |
| repeat-x | Only the horizontal position repeats the background image |
| repeat-y | Only the vertical position repeats the background image |
| no-repeat | background-image will not repeat |
| inherit | Specifies that the background-repeat property should be inherited from the parent element. |
Online Examples
How to repeat a background image vertically and horizontally?
This example demonstrates how to repeat the background image both vertically and horizontally.
How to repeat a background image only horizontally
This example demonstrates how to repeat the background image only horizontally.
How to display a background image only once
This example demonstrates how to display a background image only once without repeating it.
Related Articles
CSS Tutorial:CSS Background
CSS Reference Manual:background-position Property
other extensions