|
June 17, 1998
 |
 |
Putting Style Sheets in Perspective
CSS Rules
|
To work with CSS you need to understand that it is made
up of rules and style sheets. A rule
is the statement
about the style of the document, a style sheet is one or more
rules.
The first part of the rule is called the Selector.
Initially, we'll use basic HTML elements that you are
already familiar with as our Selectors, learning how to
make our own Selectors later.
The part of the rule enclosed within the curly brackets
is called the Declaration. A Declaration has two
parts, the part before the colon which is the Property
and the part after the colon which is the Value(s)
of that Property.
A Rule
| Selector | { |
Declarations
| property: value;
property: value;
...
|
|---|
| } |
|---|
| H1 | { | color: green | } |
(Declarations are separated by semicolons; the last
declaration doesn't need one but it's good practice to put
one anyway.)
In the above example:
H1 is the Selector,
color: green is the Declaration.
Within the Declaration:
{ Property: Value }
color is the Property, green is the Value.
Grouping
Each rule may be placed separately within the
STYLE
tags,
but that could make for some rather long headers. It
is easier to group the rules. Note that when declarations
are grouped, each declaration is separated by a semi-colon.
H1 { color: blue }
H1 { font-family: Arial }
H2 { color: blue }
H2 { font-family: Arial }
H3 { color: blue }
H3 { font-family: Arial }
|
H1, H2, H3 { color: blue;
font-family: Arial;
}
|
H1 Header
|
Additional Resources:
Putting Style Sheets in Perspective: Table of Contents
Selectors
|
