Dynamic HTML: The Definitive Reference

Subgroup Selectors

While a selector for a style sheet rule is most often an HTML element name, that scenario is not flexible enough for more complex documents. Consider the following possibilities:

• You want certain paragraphs scattered throughout the document to be set apart from running text by having wider left and right margins.

• You want all H2 elements in the document but one to be set to the color red; the exception must be blue.

• In a three-level ordered list (OL) group, you want to assign different font sizes to each level.

Each of these possibilities calls for a different way of creating a new selector group or specifying an exception to the regular selectors. In an effort to distance design from content, CSS style sheets provide three ways of creating subgroups that can handle almost every design possibility:

• Class selectors

• ID selectors

• Contextual selectors

Using these subgroup selectors requires special ways of defining selectors in style sheet rules. These selectors also require the addition of attributes to the HTML tags they apply to in the document.

Class Selectors

A class selector is an identifier you can use to assign a style to a subset of elements in a document. To apply a class selector, you first invent an identifier for the class name. To allow for the potential scripting of class names, it is wise to adhere to the rules of JavaScript identifiers when devising class names. A Java-Script identifier is a one-word name (i.e., no spaces) that can include numerals, letters, ...