Link to good site: http://hotwired.lycos.com/webmonkey/reference/stylesheet_guide/
Web reference site: http://www.webreference.com/authoring/style/sheets/
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>
Another example:
A style sheet may be embedded in a document with the STYLE element:
<STYLE TYPE="text/css" MEDIA=screen>
<!--
BODY { background: url(foo.gif) red; color: black }
P EM { background: yellow; color: black }
.note { margin-left: 5em; margin-right: 5em }
-->
</STYLE>
Linking to an External Style Sheet
An external style sheet may be linked to an HTML document through HTML's LINK element:
<LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen>
The <LINK> tag is placed in the document HEAD. The optional TYPE attribute
is used to specify a media type--text/css for a Cascading Style Sheet--allowing
browsers to ignore style sheet types that they do not support. Configuring the
server to send text/css as the Content-type for CSS files is also a good idea.
External style sheets should not contain any HTML tags like <HEAD> or
<STYLE>. The style sheet should consist merely of style rules or statements.
A file consisting solely of
P { margin: 2em }
http://www.w3.org/TR/REC-CSS1
Sample style sheet:
P, TD {font-size: 10pt;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #00006e;}
.text {font-size: 10pt;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #00006e;}
H3 {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 13pt;
color: #00006e;}
A {text-decoration: underline;}
A.anchor {text-decoration: none;}
A.noline {text-decoration: none;}
A.tocsmall {text-decoration: none;
font-size: 9pt;}
A.tocsmall:hover {color:#93beee;}
A.toc {text-decoration: none;
font-size: 11pt;
font-weight: bold;}
A.toc:hover {color:#93beee;}
A.nav:visited {text-decoration: none;
color:dimgray}
A.nav:hover {color:white;}
A.nav:link {text-decoration: none;
color: #00006e;}
H2 {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 12pt;
color: dimgray;}
LI.vertspace {list-style-image : url(images/vertspacer.gif);}
.title
{font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 12pt;
color: #00006e;}