background-repeatDictate if and in which direction your background image will repeat. Vertically is the x-axis and horizontally is the y-axis. | Value | Description | | repeat | The image will repeat both vertically and horizontally. | | repeat-x | The image will repeat horizontally. | | repeat-y | The image will repeat vertically. | | no-repeat | The image will not repeat in either direction. |
Code:p { background-image: url(../../pics/cssT/smallPic.jpg);
background-repeat: repeat; }
h4 { background-image: url(../../pics/cssT/smallPic.jpg);
background-repeat: repeat-y; }
ol { background-image: url(../../pics/cssT/smallPic.jpg);
background-repeat: repeat-x; }
ul { background-image: url(../../pics/cssT/smallPic.jpg);
background-repeat: no-repeat; } Display:This paragraph has a background image repeating in both directions (default repeat). If you use this option, make sure that your image was designed to be repeated.
This header 4 has a background image repeating vertically (y). You could this to add a style to the side of your element.
- This is an ordered list
- With a background that repeats
- Horizontally (x)
- This is an unordered list
- With a background that repeats
- in neither direction.
| 