Background
body
{
background-color: #FF0000;
}
Background Image
body
{
background: url(image path);
}
Background Image on top NO REPEAT
body
{
background: url(image path) no-repeat top;
}
Background Image FIXED
body
{
background: #00FF00 url(image path) no-repeat fixed top;
}
Background Image SCROLLS
body
{
background-image: url(image path);
background-attachment: scroll;
}
scroll : The background image moves when the rest of the page scrolls
fixed : The background image does not move when the rest of the page scrolls.
Background POSITION
body
{
background-image: url(image path);
background-repeat: no-repeat;
background-position: top left;
}
top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
body
{
background-image: url(image path);
background-repeat: no-repeat;
background-position: 0px 0px;
}
Background Repeat
body
{
background-image: url(image path);
background-repeat: repeat-x
}
repeat : The background image will be repeated vertically and horizontally
repeat-x : The background image will be repeated horizontally
repeat-y : The background image will be repeated vertically
no-repeat : The background-image will be displayed only once
|