10-21-2010, 06:49 AM
What you want to first do, is save each individual image and upload them to your site.
The CSS
1. Background
Background-repeat:repeat x,y; will repeat the image you have up and down throughout your website.
X will repeat up
Y will repeat down
no-repeat will not repeat the background.
2. Alignment
Move Left - Use a negative value for left.
Move Right - Use a positive value for left.
Move Up - Use a negative value for top.
Move Down - Use a positive value for top.
Width is explanatory, as is height.
(replace X with the numbers you want.)
B. The HTML
1. Using <div> Tags
The <div></div> tags define the part of the website you are going to call in the CSS.
For example
What we did was call the section using #name of div. And then aligned it using the Left, Top, Width, and Height attributes. You can find a list and examples of attributes
Here
Final Product:
What we did here was use CSS to align the content box, and to make the text italicized. We also called a background using CSS.
The CSS
1. Background
Code:
body
{
background-image:url('http://wwwurltobackground.png');
background-repeat:repeat x,y;Background-repeat:repeat x,y; will repeat the image you have up and down throughout your website.
X will repeat up
Y will repeat down
no-repeat will not repeat the background.
2. Alignment
Code:
position:absolute;
left: x ;
top: x;
width: x;
height: x;Move Left - Use a negative value for left.
Move Right - Use a positive value for left.
Move Up - Use a negative value for top.
Move Down - Use a positive value for top.
Width is explanatory, as is height.
(replace X with the numbers you want.)
B. The HTML
1. Using <div> Tags
Code:
<div id="insert section name">Content</div>For example
Code:
#insert section name{
background-image:url('http://www.contentimage.com/contentbackground.png');
position:absolute;
left: 350;
top: 130;
width: 676;
height: 458;Here
Final Product:
main.css (Click to View)
index.html (Click to View)
![[Image: pineapple.gif]](http://img227.imageshack.us/img227/2417/pineapple.gif)