Colours and Backgrounds 1 - Adam's HTML Planet - Tutorials and Tips on how to create websites using HTML
Colours and
Backgrounds
Part 1
 Adam's HTML Planet - Home Page
This site equipped with Key Launcher!
The following launcher keys are available:
Press the letter 'H' for: Home Page
Press the letter 'S' for: Site Map
Press the letter 'T' for: List of Tutorials
list of tutorials next tutorial

This tutorial is in two parts and assumes that you have followed tutorials one and two that take you through the steps of creating a basic web page. This first part shows how to give your page a coloured background and the second how to use an image as a background for your page.

  1. Open [in your text editor] the file you created in tutorial 2 [basic2.htm if you used my sugested name].
  2. Look at the < BODY > tag below and make the necessary additions to your file.
  3. Save the file [suggested name colours.htm]. Don't forget to save the file with the extension .htm [or .html].
  4. Open the file in your browser.
<BODY BGCOLOR="RED">
See an example

Now try changing what you just did to this <BODY BGCOLOR="#FF0000"> those are zeros not 'O's

Let's look at this a bit closer.

First of all note the American spelling of COLOR [not COLOUR] - all HTML tags use American spellings

<BODY BGCOLOR="RED">
This tells the browser to display the background as red

<BODY BGCOLOR="#FF0000">
This also tells the browser to display the background as red - but here we're using the hexadecimal code for colours. There are only a few colours that can be displayed using words and so using the hex codes can give you far more control over the shades of colour you can use on your pages. Hex works by using the # sign followed by six digits - two each for controlling how much of red, green and blue respectively is displayed. 00 is as little of a colour as you can get and FF is as much as you can get. You have to be a bit cleverer than myself to be able to work the hex codes out with any great accuracy but, thankfully there are plenty of places on the net where people have already done the hard work for us. For a complete explanation of the hex codes check out this page.

Go up to the top of the pageUp Arrow to choose where you go next

.