HTML and CSS Reference
In-Depth Information
background-repeat: no-repeat; /* No tiling. The image will be
used only once. */
background-repeat: repeat-x; /* Tiles horizontally (i.e.
along the x-axis) */
background-repeat: repeat-y; /* Tiles vertically (i.e. along
the y-axis) */
background-repeat: inherit; /* Uses the same background-
repeat property of the element's parent. */
Background position
The background-position property controls where a background
image is located in an element. The trick with background-position is
that you are actually specifying where the top-left corner of the image will be
positioned, relative to the top-left corner of the element.
In the examples below, we have set a background image and are using the
background-position property to control it. We have also set
background-repeat to no-repeat . The measurements are all in pixels.
The first digit is the x-axis position (horizontal) and the second is the y-axis
position (vertical).
/* Example 1: default. */
background-position: 0 0; /* i.e. Top-left corner of element.
*/
/* Example 2: move the image to the right. */
background-position: 75px 0;
/* Example 3: move the image to the left. */
background-position: -75px 0;
/* Example 4: move the image down. */
background-position: 0 100px;
Search WWH ::




Custom Search