Tutorial 5 : CSS Basics and background color

Welcome to Tutorial 5 : CSS Basics. In this tutorial I shall show you how to use CSS files to make website creation easier and quicker. For example; It is far easier to write one piece of code once than have to write it 50 times for 50 webpages in a website.

Firstly I want you to open up Microsoft Visual Web Developer which is a free easy to use and powerful tool which will help you a lot in website creation. It can be downloaded from the Microsoft website.

I want you to start a new website. Make sure its an empty website, and then add both a HTML file and a Style sheet. Name them whatever you want.

Next I want you to open up the HTML file, as you can see the basic HTML structure is laid out for you already. Next in the head section I want you to type the following line

<link rel="stylesheet" type="text/css" href="StyleSheet.css" />

Make sure that you change StyleSheet.css to whatever you have named your style sheet.

Now we have a link to our style sheet from our HTML file.

Secondly I would like you to open up your Style sheet as we are now going to be writing some CSS!
If all goes to plan you should have something similar to this:

body{

}

This means that whatever you code into the brackets will directy effect whatever is in your &alt;body> tags which is your whole website.

Now I would like you to type in:

background-color:Red;

Now when you go back and preview your webpage it should have a Red background. As you can see this could be incredibly useful if you have hundreds of webpages all following the same design.

So congratulations you have completed Tutorial 5 : CSS Basics and background color.

Please stay tuned for more HTML and CSS tutorials and remember to follow my blog either view RSS or through blogger's follow function! Thanks!