My-Hosts.com
Cheap Hosting, domain registration and design. Check this out for more details.
Navigation
Site Breadcrumb - You are here
Mulder's Stylesheets Tutorial
Lesson 4
by Steve Mulder
Page 2 —
Colorizing Your World
color
The color property won't sound alien, because it works much like you'd expect it to and uses the same kinds of values as HTML.
B { color: #333399 }
With this CSS rule, as soon as you have bold text on your page, like this text, the browser will display it in the appropriate color. In reality, what you're doing is specifying the "foreground" color of the text.
If your browser doesn't support this CSS property, click here to see what it looks like.
There are three ways of defining which color you want:
Color names
These are the same color names we're used to. The basic 16 are aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.
But Netscape's and Microsoft's browsers also recognize hundreds of other color names. A great place to see them all is HYPE's Color Specifier.
Hexadecimal numbers
For even more control, use hex, which comes in the format #336699. We don't have time to go into all the details of the hexadecimal format here; if you want the scoop, start at Webreference.com.
By the way, CSS also supports a shorthand notation for certain hex values. A value of #336699, for example, can be declared as #369. The browser will translate that into the six-digit format.
RGB values
Finally, there's a brand-new way of specifying color for those who are used to the RGB notation, which is traditionally used in graphics applications such as Photoshop. A color property with an RGB value would look like this:
B { color: rgb(51,204,0) }
If you're not familiar with RGB, the range is from 0 to 255, with one number each for R (red), G (green), and B (blue).
IE 3 doesn't support the RGB format, but 4.x and 5.x browsers do.
That wraps up our quick tour of using color in the foreground. But you can also use color in the background.
