CSS/Properties/background-repeat

From W3C Wiki
Jump to: navigation, search

background-repeat

The background-repeat property specifies whether the image is repeated (tiled), and how.

Description

Values repeat | repeat-x | repeat-y | no-repeat | inherit
Initial value repeat
Applies to All elements
Inherited No


Point, Note

  • All tiling covers the content, padding and border areas of a box.


Values

  • repeat
    The image is repeated both horizontally and vertically.


  • repeat-x
    The image is repeated horizontally only.


  • repeat-y
    The image is repeated vertically only.


  • no-repeat
    The image is not repeated: only one copy of the image is drawn.


  • inherit
    Takes the same specified value as the property for the element's parent.


Example

Example A

[style.css]

 body {
   background-image: url("images/bg.png");
   background-repeat: repeat-x;
 }

[index.html]

  <body>
    <p>This is a paragraph</p>
  </body>

Csslist2 background-repeat.png


CSS Reference

The CSS specification defines the background-image property in 14.2.1 Background properties.