The style sheet syntax conforms to the CSS2 (Cascading Style Sheet level 2) specification with a few divergences.

The general template of a style rule in a style sheet is therefore:

For visualization purposes, the selector applies to objects in the data model, and is used for pattern-matching; the declarations apply to the corresponding graphic objects, and are used for rendering.

Declarations have the form:

An example of a style rule is:

This rule sets the line width of series of name "Sales" to 2.

A CSS document (a style sheet) consists of a set of style rules. Each rule starts with a selector and is followed by a declaration block enclosed by curly braces. The selector defines a pattern, and the declarations are applied to the objects that match the pattern.

For a full description of CSS syntax, see http://www.w3.org/TR/REC-CSS2/.

The simple example below shows how to apply the color red to all emphasis elements.

where em is the selector, and “ color : red; ” is a declaration.

It is possible to group several rules with the same declarations. Use a comma “,” to separate the selectors. For example:

The W3C states that “A selector represents a structure. This structure can be understood for instance as a condition that determines which elements in the document tree are matched by this selector, or as a flat description of the HTML or XML fragment corresponding to that structure.”

Examples of selector:

A selector is composed of one or more simple selectors.

Examples of simple selectors:

A simple selector is made of minimal building blocks.

Examples of minimal building blocks of selectors:

When two or more simple selectors are aggregated into a selector, they are separated by combinators. A combinator is a single character which semantics is described in Table 3.1. Extra spaces are ignored.

The minimal building blocks of a selector are listed in Minimal Building Blocks of a Selector . For an explanation of the Specificity column, see Priority.

For example, the following line:

matches <P class="pastoral marine old">, sets the color of the paragraph to green, and sets the font size to 10.

All rules start and end with an implicit “ * ” pattern. This means that a selector can match anywhere inside the hierarchy.

Declarations are key-value couples. The separator is a colon (:). Each declaration is terminated by a semicolon (;). The key should represent a predefined graphic attribute ( foreground, size, font, and so forth) and the value is a literal whose type depends on the key (such as red, 10pt, or serif ). All key-value pairs are String. Enter values in single or double quotation marks, but use single quotation marks when the values contain nonalphanumeric characters.

Inside quoted declaration values, you can use Unicode characters in two ways:

The priority of the rules depends on their relative specificity. Specificity is computed as three numbers, a - b - c (in a number system with a large base).

The examples in Priority Order Example  are in priority order, with the most specific first.

When two rules give the same specificity number, the order of appearance gives the priority: the last to appear has higher priority than the previous rules with the same specificity.

Priority is used is as follows: first the declarations of all rules that match the same objects are merged, and then the priority is applied only if there is a conflict (same key value) within the merged declaration block.

Cascading consists of supplying several sources for the style. In HTML environments there are three sources: the browser, the user, and the document. Cascading fixes another weight according to the source of the style. Document style takes precedence over user style, which takes precedence over browser style when the specificity number is the same.

There are two more tokens, !important and inherit. They are used to alter the cascading priority inside declarations.

A style sheet can also import other sheets (internal cascading). The syntax is:

@import "[url]";

Import statements must precede the first rule in a style sheet. Priorities of the imported rules are computed as if the rules replace the import statements. Here is an example of import:

The main principle of CSS is the inheritance of declarations. Once the rules are checked against the source document, the matched declarations are sorted according to the priority order of the rules. The declarations are merged, with higher priority settings overriding lower ones in case of conflict.

The resulting set of key-value pairs represents all the declarations that the style sheet applies to a particular document.