In this installment, we'll cover adding colored background and text.
To change the background color of the document, use "bgcolor=" in the <body> tag:
<body bgcolor="#ffffff">
This will yield a white background.
<body bgcolor="#000000">
This will yield a black background.
Notice that each color specification has six characters after the octothorpe. These are really three two-place hexadecimal (base 16) numbers. The first one is the level of red, the second one is the level of the green, the third is the level of the blue. "#ff0000" would be bright red, "#00ff00" would be bright green, "#0000ff" would be bright blue. Other colors are made by mixing them. There are 256 levels of each color, from 0 (dark) to ff (255, bright).
Here's how the hex numbers work:
Hex Decimal 00 0 01 1 02 2 03 3 04 4 05 5 06 6 07 7 08 8 09 9 0a 10 0b 11 0c 12 0d 13 0e 14 0f 15 10 16 11 17 . . . 20 32 21 33 . . . a0 160 a1 161 . . . f0 240 f1 241 . . . ff 255
OK, let's say that we've used the above tag to set a nice gothic black background. Will the user be able to see the text against a black background??
Maybe not, if their browser is set to render text in black. To change the color of the text to white, we use "text=" in the <body> tag.
To set the background to black, and the text to white, use this <body> tag:
<body bgcolor="#000000" text="#ffffff">
Since we're getting pretty radical with our colors here, it might be a good idea to specify what colors we want for links as well. Use "link=" to set the color of the links, and "vlink=" to set the color of visited links. If you want to set the color that the link flashes while being clicked on, use "alink=".
What if you just want to change the color of one word, or one sentence? You use the <font> and </font> tags with "color=" in the first tag. To make some text red, enclose it in <font color="red"> and </font> tags:
<font color="green">This text is green</font>
Notice that we used the words "red" and "green" instead of a hexadecimal specification. When you want a primary color, this is often easier. However, there are many legal color names, and even more illegal ones. This can make it easier to twaddle some bits and mix your own color.
There is a big list of legal color names at http://devedge.netscape.com/library/manuals/1998/htmlguide/colortab.html It has fun colors such as "burlywood", "gainsboro", and "moccasin". Mixing your own colors might be more useful... :-)
Here's an example page:
<html> <head> <title>Yet Another example</title> </head> <body bgcolor="#000000" text="#ffffff" link="#0000ff" vlink="#00ff00" alink="#ff0000"> <h1>This example deals with colors</h1> <hr> <p> This is a very short paragraph. <p> Another paragraph. <p> <a href="tut_index.html">This is a link backto the index.</a> <p> <a href="http://www.netscape.com/">This is a link to Netscape</a> <p> Here we have some <font color="red">red text</font> mixed in with the white. <hr> </body> </html>
The background is black, ordinary text is white, links are blue, they flash red when they are clicked on, and they turn green after you've clicked on them. There are two words of ordinary text that are colored red.
Next time, I think we'll cover lists which are formatted by the user's browser.