Style Sheet Rules

Previous Next

See Also

There are two ways to create cascading style sheets. You can either use a normal text editor and write the style sheets "by hand", or you can use a dedicated tool that supports CSS - for example a Web page design application. The dedicated tools allow you to create style sheets without learning the syntax of the CSS language. However, in many cases the designer wants to tweak the style sheet by hand afterwards, so we recommend that you learn to write and edit cascading style sheets by hand.

Here is an example of a simple style sheet rule:

H1 { color: green }

This is a simple style sheet that contains one rule. A rule is a statement about one stylistic aspect of one or more elements. A style sheet is a set of one or more rules that applies to an HTML document. This rule sets the color of all first-level headings (H1).

A rule consists of two parts:

· The selector is the part before the left curly brace. This is the link between the HTML document and the style. It specifies what elements are affected by the declaration. In the example, the selector is H1.

Selectors can be grouped in comma-separated lists:

H1, H2, H3 {...}

· One or more declarations within curly braces. A declaration states the effect of a rule. Each declaration has two parts separated by a colon:

<property>: <value>

Multiple declarations are separated by semicolons.

Setting colors and backgrounds are among the most common tasks performed by CSS. Other common tasks include setting fonts, borders, and white space around elements.

In the Cascading Style Sheet, level 1 specification of the World Wide Web Consortium (W3C), around 120 properties are defined, and you can assign values to all of them.

Related Topics:

How to Apply Style Sheet Rules

How to Define a Style Sheet Rule