Style Sheet Rules

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. The selector specifies what elements are affected by the declaration. In the example, the selector is H1.

•One or more declarations. A declaration states a rule. It sets a property of the element(s) designated by the selector(s) to a value.

Selectors can be grouped in comma-separated lists:

H1, H2, H3 {...}

Each declaration has two parts separated by a colon:

Between the curly braces, you can have multiple declarations 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.