13. Colors and Backgrounds


Colors and Backgrounds

Plus More Selectors And External Style sheets

In this Chapter

CSS color names

RGB color values

Foreground and background colors

Tiling background images

Color gradients

Pseudo-class, pseudo-element, and attribute selectors

External style sheets

If you had seen the web back in 1993, you would have found it to be a dreary affair by today’s standards—every background was gray, and all the text was black. Then came Netscape Navigator and, with it, a handful of HTML attributes that allowed rudimentary (but welcome) control over font colors and backgrounds. For years, we made do. But thankfully, we now have style sheet properties that have laid those unmentionable presentational attributes to rest.

We’re going to cover a lot of ground in this chapter. Of course, I’ll introduce you to all of the properties for specifying colors and backgrounds. This chapter also rounds out your collection of selector types and shows you how to create an external style sheet. Our first order of business, however, is to explore the options for specifying color in CSS, including a primer on the nature of color on computer monitors.

Specifying Color Values

There are two main ways to specify colors in style sheets—with a predefined color name, as we have been doing so far:

color: red;        color: olive;        color: blue;

Or, more commonly, with a numeric value that describes a particular RGB color (the color model on computer monitors). You may have seen ...

Get Learning Web Design, 5th Edition now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.