Accueil1![Double backround [phpBB2] Empty](https://2img.net/i/empty.gif)
Double backround [phpBB2] 31/1/2010, 23:52
Final-Blonde
Staff du forum
This tutorial is a translation of this tutorial here.
In the template overall_header_new search (Ctrl+F) this :
In the template overall_footer search this :
Put this in the stylesheet CSS :
In blue: Put the image address of the second background.
Black:
- For the image does not scroll down : fixed
- For the image should scroll down : scroll
Green:
- For the image does not repeat itself : no-repeat
- For the image is repeated mosaic : repeat
- For the image is repeated horizontally : repeat-x
- For the image is repeated vertically : repeat-y
Orange:
- To align vertically the image up : top
- To align to bottom : bottom
- To align center : middle
Red:
- To align horizontally the image left : left
- To align right : right
- To align center : center
Regarding the double background:
The second fund will be to overlay the "normal" one.
The second pattern may not feel completely up the page, if you have an image that should touch the footer use the normal background.
To make your adjustments on the normal background, here's how to edit and move your page background via CSS :
In the template overall_header_new search (Ctrl+F) this :
- Code:
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
- Code:
<div id="bodybottom" style="padding: 0px; margin: 0px">
In the template overall_footer search this :
- Code:
<script type="text/javascript">
//<![CDATA[
fa_endpage();
//]]>
</script>
</body>
- Code:
</div>
Put this in the stylesheet CSS :
Complete with the properties of the second background :/*Body_Fix-------------------------------------------------*/
body, #bodybottom { padding: 0px; margin: 0px; }
/*Double_Fond-------------------------------------------------*/
#bodybottom {
background-attachment: scroll;
background-image: url("image_url");
background-repeat: repeat;
background-position: top left;
}
In blue: Put the image address of the second background.
Black:
- For the image does not scroll down : fixed
- For the image should scroll down : scroll
Green:
- For the image does not repeat itself : no-repeat
- For the image is repeated mosaic : repeat
- For the image is repeated horizontally : repeat-x
- For the image is repeated vertically : repeat-y
Orange:
- To align vertically the image up : top
- To align to bottom : bottom
- To align center : middle
Red:
- To align horizontally the image left : left
- To align right : right
- To align center : center
Regarding the double background:
The second fund will be to overlay the "normal" one.
The second pattern may not feel completely up the page, if you have an image that should touch the footer use the normal background.
To make your adjustments on the normal background, here's how to edit and move your page background via CSS :
body {
background-attachment: fixed;
background-image: url("image_url");
background-repeat: repeat;
background-position: top left;
}