HTML- Lesson 4 - Putting Together Styles

This lesson goes through some of the very basics of styling your pages, by the end of this tutorial you should be able to make font sizes, colors, background colors and borders.

First of all we will make a decleration that makes your text become coloured. CSS may at first seem daunting but its very simple. Use this code to make font colours:

h1
{
color:blue;

}

Simple eh.. now any header text will be blue. Now its time to Bring in backgrounds.Use this code:

h1
{
color:blue;
background-color:green;

}

Watch out for this one, make sure you add the hyphen in. Now you have blue text on a green background. Now its time for font sizes. Ad the code:

h1
{
font-size:7;
}

You should use this code to change the font size. Please note that there are many different ways to change the font size which you can explore but it is easier to use the values 1-7.

Last of all is the borders. For the best effect you should use the border properties and padding properties together. Use the code:

h1
{
border:3px solid green;
padding:7px;
}

That Should create a border that is green and three pixels wide with a distance of 7px between the border and the text.

The rest is up to you, i have given you some properties to play with but the rest is up to you, experiment with them.