If you use the {background-repeat: no-repeat} the image doesn't tile it just displays once.(To see the effect work I have made box that is 300px width.)
{background-repeat: repeat-x} makes the image to tile horizontally. (To see the effect work I have made box that is 300px width.)
{background-repeat: repeat-y} makes the image to tile vertically. (To see the effect work I have made box that is 300px width.)
{background-attachment: fixed} makes the image what is said, fixed, it doesn't scroll with the text. (To see the effect work I have made box that is 300px width and 200px height.) Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space. Just some text to fill out the space.
{background-repeat: repeat-y; background-position:right;} makes the image to tile vertically at the right. (To see the effect work I have made box that is 300px width.)
{background-repeat: repeat-x; background-position:bottom;} makes the image to tile horizontally at the bottom. (To see the effect work I have made box that is 300px width.)
The Shorthand Property
{background: url(swirl.jpg) #c0c0c0 repeat-y top right} With he shorthand property, you can define background color, image, tiling method, scrolling versus fixed status, and position.