background
|
|
Computer

RiscOS
Risc OS Info
All you need to know about Risc OS and more.
More icon
|
|
Up Image
Navigation
Search this Site
Enter your search terms

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.

next page»