Home

Basics

Using Flags

More Text Flags

Placing Images

Colors

Backgrounds

Linking Pages

Tables

Getting Online

HTML Basics, Tips and Tricks
by Fox Bautista

COLORS

 

In order to change text colors, you will need two things: a command to change the text, and a color (hex) code. The color codes, as I said above, are technically called hex codes. The codes aren't too user friendly, and you'll need a chart to tell you what code makes what color. You can find one here, so don't panic:

http://www.hidaho.com/colorcenter/cc.html

Now, this is more than just a chart-- you can actually play around with the colors and see how they look on text and in the background. You can make all kinds of cool or wacky combinations here. Go ahead, play around. When you're done, write down a few hex codes of your choice and let's go through the rest of the lesson.

Changing Full-Page Text Colors

You have the ability to change full-page text colors over four levels. Within the BODY flag of your HTML document (remember the simple webpage we set up earlier?), you can add:

TEXT="######" to denote the color of all text on the page.
LINK="######" to denote the color of your links (links will be covered in another lesson).
ALINK="######" to denote the color your links will flash when clicked upon.
VLINK="######" to denote the color of visited links.

The colors in the BODY flag of this page go something like this: <BODY TEXT="#FFFFFF" LINK="#66FFFF" VLINK="#66CCFF"> So all the regular text here is white (#FFFFFF), the links are light blue (#66FFFF) and the visited links are a different shade of light blue (#66CCFF). I didn't bother with the ALINK flag.


One Word at a Time

To change the color of a single word, or a portion of text, even after the text color has been set in the BODY flag, use the <FONT> flag like this:

<FONT COLOR="######">blah blah blah</FONT>

So let's say I want one section of text green, and the next one orange:

<FONT COLOR="#33FF33"> I WANT THIS TO BE GREEN </FONT><FONT COLOR="#FFCC33 ">AND THIS HAS TO BE ORANGE!</FONT>

Having to use the <FONT> and </FONT> flags every time we want to change the font color is a pain in the butt, but that's what we gotta do.

That's all for this lesson. Up next: Backgrounds !