Cover by Ian Lunn

Safari, the world’s most comprehensive technology and business learning platform.

Find the exact information you need to solve a problem on the fly, or go deeper to master the technologies and skills you need to succeed

Start Free Trial

No credit card required

O'Reilly logo

chapter four

Creating Styles Using Property Values

So far, you’ve used a handful of properties to add styles to the page, such as background-color, background-image, and color. You learn more of these properties from Chapter 5 onward. Before that, take a look at the different types of values that can be used with properties, allowing you to apply the exact styles you want to a page.

Color Keywords

You’ve already added some colors to the page, which all made use of color keywords, like so:

#main {

    background-color: white;

}

White is one color keyword of 16 that CSS defines:

Black

Silver

Gray

White

Maroon

Red

Purple

Fuchsia

Green

Lime

Olive

Yellow

Navy

Blue

Teal

Aqua

In CSS Level 3, another 146 color keywords have been added. I don’t list them all here, but you can find them at www.w3.org/TR/css3-color/#svg-color.

css3_badge.psd  So, as those extended color keywords were introduced in CSS Level 3, does that mean they won’t work in older browsers that don’t support CSS3? Not quite. This is one of those times when CSS3 was updated to match what was already being implemented by browsers. The extended colors, known as X11 colors, are originally from another browser technology—SVG. SVG has been supported in browsers for many years, and because of that, so too have most of the extended colors. I say “most” because you may find some browsers don’t support all 146 extended ...

Find the exact information you need to solve a problem on the fly, or go deeper to master the technologies and skills you need to succeed

Start Free Trial

No credit card required