My CSS tutorial

Embedding a Stylesheet
<HEAD>... <STYLE TYPE="text/css"> H1 { color: green; font-family: impact }
P { background: yellow; font-family: courier } </STYLE> </HEAD>
Linking to a Stylesheet
<HEAD>... <LINK REL=stylesheet HREF="mystyles.css" TYPE="text/css"> </HEAD>
Importing a Stylesheet (not shown here)
Adding Styles Inline
Classes
a) P.second { color: purple }
b) .mycolor { color: green }
Properties
font-family (helvetica, impact, sans-serif, "gill sans"...)
font-size (16pt, 1.5em, 20px, in, cm, mm, xx-small, x-small, small, medium, large, x-large, xx-large)
font-style (italic, normal)
font-weight (bold, 100, 200, 300, 400, ..., 900)
font-variant (small-caps)
text-transform (uppercase, capitalize, none)
text-decoration (underline, overline, line-through, blink, none)
font (12pt/16pt courier) [font-size, line-height, and font-family respectively]
word-spacing (see 'font-size')
letter-spacing (ditto)
line-height (by number, by length unit, and by percentage)
text-align (left, right, center, justify)
vertical-align (top, bottom, text-top, text-bottom, baseline, middle, sub, super)
text-indent (measures)
margin-top, -right, -bottom, -left (measures) [t r b l: clockwise]
padding-top, padding-left, etc. (measures)
border-width (measures)
border-color (...)
border-style (solid, double, dotted, dashed, groove, ridge, inset, outset)
float (left, right)
clear (left, right, both)
color (...)
background-color (...)
background-image (url(/.../....gif))
background-repeat (no-repeat)
background-attachment (scroll, fixed)
background-position (center bottom, etc.)
background (the previous ones)
position; left; top; width; height; overflow; visibility; clip; z-index
Created: 19-Dec-2003 — Last update: 2006-12-12