HTML & XHTML: The Definitive Guide, 5th Edition

Style Syntax

The syntax of a style — its “rule,” as you may have gleaned from our previous examples — is very straightforward.

The Basics

A style rule is made up of at least two basic parts: a selector , which is the name of the HTML or XHTML markup element (tag name) that the style rule affects, followed by a curly brace ({} )-enclosed, semicolon-separated list of one or more styleproperty:value pairs:

selector {property1:value1; property2:value1 value2 value3; ...}

For instance, we might define the color property for the contents of all the level-1 header elements of our document to be the value green:

h1 {color: green}

In this example, h1 is the selector, which is also the name of the level-1 header element, color is the style property, and green is the value. Neat and clean.

Properties require at least one value but may have two or more values. Separate multiple values with a space, as is done for the three values that define property2 in our first example. Some properties require that multiple values be separated with commas.

Current styles-conscious browsers ignore letter case in any element of a style rule. Hence, H1 and h1 are the same selector, and COLOR, color, ColOR, and cOLor are equivalent properties. At one time, convention dictated that HTML authors write selector names in uppercase characters, such as H1, P, and STRONG. This convention is still common and is used in the W3C’s own CSS2 document.

However, current standards dictate, particularly for XML-compliant documents, ...