Have Fun With Color
Notice the spelling of the word COLOR. Please remember to use the American spelling, otherwise the browser will not recognise it and your coding will not work.
This is the exciting part of your html experience. Now you will be able to change the color of text, background, and even that horizontal rule.
However, you must first learn about Safe Colors. There are 216 browser safe colors. If you do a google search it is easy to find the palette for safe colors.
If you want lots of color on your website it's important that other people viewing your website see it as you do. This is why we choose from the safe color palette. There's no point in you having a radical luminescent color as your background if most of the world see it as grey. Choose from the safe color palette, then you will be safe with your website and have peace of mind knowing that the world out there is viewing it correctly.
Let's change the color of the horizontal rule. We will add the color attribute to the tag.
<hr width="75%" color="purple">
You may use either the name of the color or the hexadecimal value. This is what it looks like using the hexadecimal value.
<hr width="75%" color="#cc00ff">
Now that html coding has develped further we are expected to write xhtml coding, so we must remember that in xhtml we are not supposed to add attributes to the horizontal line, ie no width or color. How sad!
Note: It is safer to use hexadecimal values if you want your website to be validated. There are only a limited number of color names that can be validated, these are: aqua, black,blue, fuchsia,gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow.
Let's now use color to change some of the text. If I want to change the color of the word red in this sentence, this is what I have to do.
I like the color <font color="red">RED</font>
I like the color RED
Or you can use the hexadecimal value.
I like the color <font color="ff0000">RED</font>
I like the color RED
The background color attribute is added to the body tag. We will also use the style method here.
<body style="background-color:ccff99">
Have you ever noticed that when you click on a link to a webpage that the color of the link changes? We need to set the color of our links within the body tag. This sets the color of the links for the whole page.
Link Color
link="#??????"
Visited Link Color
vlink="#??????"
Activated link color
alink="#??????"
TOP BACK
HOME NEXT
