CSS Quick-Reference
While not exhaustive, this is a reference of the CSS elements I most commonly use.
CSS Placement Examples
Linked
<link rel="stylesheet" href="mysheet.css" type="text/css" media="screen" />
Embedded
<style type="text/css">
<!--
body { color: #000000; font-family: san-serif; font-size: 12px;}
.hugecenter { font-weight: bold; font-size: 25px; text-align: center }
-->
</style>
Selectors
HTML elements which are selected to be styled with CSS are called "selectors." They can beHTML Tags
p { style information }
body { style information }
Classes
p.subject { style information }
.big_note { style information }
Pseudo-Classes
a:link | a:active | a:visited p:first-line | td:first-letter
Font Properties
font-face
Multiple font faces can be specified, separated with commas"Times New Roman", Arial serif, sans-serif, cursive, fantasy, monospace
font-style
normal | italic | oblique
font-weight
normal | bold | bolder | lighter 100 | 200 ... 900
font-size
xx-small, x-small, small, medium, large, x-large, xx-large 10px | 1em | 110%
Text Properties
word-spacing
5px | 2em | 110%
text-decoration
none | underline | overline | line-through | blink
vertical-align
baseline | sub | super
text-transform
none | capitalize | uppercase | lowercase
text-align
left | right | center | justify
text-indent
10px | 2em
Background and Colors
For a list of the color names ("blue", etc.) allowed, see the chart at the top of my HTML Reference.color
This is the text color.transparent | #0000FF | blue
background-color
transparent | #FF0000 | red
background-image
none | url(/ratz/rat.jpg)
background-repeat
repeat | repeat-x | repeat-y | no-repeat
background-attachment
scroll | fixed
background-position
top | center | bottom | left | center | right
Box Element Modifiers
width | height
40px | 20em | 70%
border-width
also border-top-width | border-bottom-width | border-left-width | border-right-width2px
border-style
none | dotted | dashed | solid | double | groove | ridge | inset | outset
border-color
also border-top-color | border-bottom-color | border-left-color | border-right-colorgreen | #00FF00
