mercoledì 7 novembre 2012

Background Image

If we want to use an image as background of our web page, we can follow two different ways.

The first is:

/*here the html code*/
<body>
     <img class="bg" src="image.jpg" />
     ...
</body>


/*here the css code*/

body
{
       margin: 0px;
       padding: 0px;
}

img.bg
{
       widthauto;
       height: auto;
       position: fixed;
       top: 0;
       left: 0;
       z-index:-9999;
}


In the css code we anchor the image on the left-top side of the page that have no margin and no padding. 
If we want, we can anchor on top-right or bottom(left-right) of the page, it depends of what we want; in fact if we anchor on top-left (for example) we will always see the top and left sides of the photo, and the right - bottom sides could be cut, according to the different resolutions.
If we want to see the all width or the all hight of the image we write the css as follow:
       width100%;
       height100%;