|
A style sheet is made up of style rules that tell a
browser how to present a document. There are various
ways of linking these style rules to your HTML documents,
but the simplest method for starting out is to use HTML's
STYLE element. This element
is placed in the document HEAD,
and it contains the style rules for the page.
Note that while the STYLE
element is a good method of experimenting with style
sheets, it has disadvantages that should be considered
before one uses this method in practice. The advantages
and disadvantages of the various methods are discussed
in the section on linking style sheets to HTML.
Each rule is made up of a selector--usually
an HTML element such as BODY,
P, or EM--and
the style to be applied to the selector.
There are numerous properties that may be
defined for an element. Each property takes a value,
which together with the property describes how the selector
should be presented.
Style rules are formed as follows:
selector { property: value }
Multiple style declarations for a single selector may
be separated by a semicolon:
selector
{ property1: value1; property2: value2 }
As an example, the following code segment defines the
color and font-size
properties for H1 and H2
elements:
<HEAD>
<TITLE>CSS Example</TITLE>
<STYLE TYPE="text/css">
H1 { font-size: x-large; color: red }
H2 { font-size: large; color: blue }
</STYLE>
</HEAD>
The above style sheet tells the browser to show level-one
headings in an extra-large, red font, and to show level-two
headings in a large, blue font. The CSS1 Specification
formally defines all properties and values available.
Cascading Style Sheets help: Properties
and Values
|