Changing Background and Color of Main Content
Changing background
- Apply to the div id="main-content" (this section)
- Change the background-color (#CCFFFF)
- Inserting a picture at the top of the section with these CSS clauses :
#g_body
{
background-image: url(url of the picture);
background-position: top center;
background-repeat: no-repeat;
background-attachment: scroll;
}
Changing Color of Background
- Click on the color :
| . | . | . | . | . | . | . | . | . | . |
- Just define the color for the body :
body
{
background-color: #xxxxxx;
}
{
background-color: #xxxxxx;
}
Changing Background of Container
- Change the CSS for id #container
#container
{
background-image: url(url of the picture);
background-repeat: repeat-y;
background-position: left top;
}
{
background-image: url(url of the picture);
background-repeat: repeat-y;
background-position: left top;
}
A Background for a div block
- We create a div block and define a background :
.divback {
background-image: url(url of the picture);
background-position: top center;
background-repeat: repeat-y;
border: solid 2px #7b84af;
width: 470px;
}
background-image: url(url of the picture);
background-position: top center;
background-repeat: repeat-y;
border: solid 2px #7b84af;
width: 470px;
}
- The result :
A Picture as Background
- Click on the thumbnail :
- We use this CSS :
body
{
background: none transparent scroll repeat 0% 0%;
}
More Informations
- A background with attachment fixed
- Opacity and Transparency
- Scroll text and pictures within a fixed div block
One Day - One Label - One Wine
