How to Insert a picture as your background
There are two ways in which you can do this tutorial.
Option One You can just use to text edit files and type in all the code yourself.
You will first create an html document and a css document in your text edit. Save both in the same folder.
Put the basic tags in the html document.
<html>
<head>
</head>
<body> Don't forget your closers!
</body>
</html>
In between the 'head' tag you are going to put your link connecting to your css style sheet.
<link href="backgroundstyles.css" rel="stylesheet" type="text/css">
You can copy this link and use it in yours. Make sure to change the 'href' to be the name of your style sheet page. The other two will remain the same.
Save both files and your pages should link together.
Next open your style sheet
This is all that you should type into your style sheet.
body
{
background-image:url("texture.jpg");
background-repeat: repeat;
}
(The 'body' is there to show you where you are applying this image).
You can also choose to have your image repeat either on the y axis(repeat-y), the x axis(repeat-x), the entire page(repeat), or none at all (no-repeat). above I chose to have the image repeat.
Option Two Once you understand how to use Dreamweaver It is much quicker to do this but I think it is important to know the html code to better understand what and how you are doing this.
So to do this in dreamweaver open both documents (html and css) in dreamweaver.
With your cursor in the 'head' tag of your html document, go the css styles tab, there is a link icon at the bottom. click on this (circled in red).
a pop-up box will appear for you to enter in your css page link. Enter your file where it asks for the file/URL
Hit ok and the link will appear on your html document
Next start to type in
body {background-image... in your css styles sheet. Keep your cursor there. The styles tab will now show the properties bar with all of your different options. Scroll down to where it says 'background image' and type in your URL as pictured below.
Directly below that is where you can change the repetition of your image.
Both ways will successfully give you a background image, take your pic
And that's that, now you have a lovely background for your next amazing website.
Good Luck!
