Web Design in a Nutshell, 3rd Edition

CSS Property Conventions

The CSS chapters in this book use the same syntax for indicating allowable property values that are used in the W3C CSS 2.1 Recommendation. A few examples are shown here:

Value: [<family-name>,]* <family-name>

Value: <uri> [ mix || repeat ]? | auto | none | inherit

Value: [ <border-style> || <border-width> || <border-color> ] | inherit

Value: [<color>|transparent]{1,4}|inherit

The notation indicates the value options and requirements, but it is not always intuitive. The various conventions are explained briefly here.

• Words that appear on their own (for example, inherit) are keyword values that must appear literally, without quotes.

• When punctuation such as commas and slashes (/) appear in the option, they must be used literally in the value as indicated.

• Words in brackets give a type of value (such as <color> and <uri>) or a reference to another property (as in <border-style>).

• If a vertical bar separates values (for example, X | Y | Z), then any one of them must occur.

• A double vertical bar (X || Y) means that X, Y, or both must occur, but they may appear in any order.

• Brackets ([...]) are for creating groups of values.

Every word or bracketed group may be followed by one of these modifiers:

• An asterisk (*) indicates the preceding value or group is repeated zero or more times.

• A plus (+) sign indicates that the preceding value or group is repeated one or more times.

• A question mark (?) indicates that the preceding value or group is optional.

• A pair of numbers in curly ...