Name of
Property
|
Rule syntax
|
Possible values
|
|
font-family
|
<selector> {font-family:<value>} |
<family-name> (specify) or <generic-family>~ [serif, sans-serif*, cursive*,
fantasy*, monospace] |
|
|
font-style
|
<selector> {font-style:<value>} |
normal, italic |
|
|
font-weight
|
<selector> {font-weight:<value>} |
normal*, bold, 100*, 200*, 300*, 400*
, 500*, 600*, 700*, 800*, 900*
|
|
|
font-size
|
<selector> {font-size:<value>} |
<absolute-size>, <relative-size>*, <length>~~, <percentage> |
|
|
font $
|
<selector> {font:<value>} |
<font-style>~~, <font-weight>*, <font-size>**, <font-family>**
|
|
Color and Background
|
Name of
Property
|
Rule syntax
|
Possible values
|
|
color
|
<selector> {color:<value>} |
<color> (see "Units of Measure") |
|
|
background-color
|
<selector> {background-color:<value>} |
<color> (see "Units of Measure") |
|
|
background-image
|
<selector> {background-image: url(<value>)} |
URL (relative or absolute path) |
|
|
background $
|
<selector>{background:<value>} |
<background-color> (i.e., <color>)
|
|
Text properties
|
Name of
Property
|
Rule syntax
|
Possible values
|
|
Text-decoration
|
<selector>{text-decoration:<value>} |
underline, line-through |
|
|
text-transform
|
<selector>{text-transform:<value>} |
capitalize*, uppercase*, lowercase*, none*
|
|
|
text-align
|
<selector>{text-align:<value>} |
left, right, center, justify*
|
|
|
text-indent
|
<selector>{text-indent:<value>} |
<length>, <percentage>
|
|
Box properties
|
Name of
Property
|
Rule syntax
|
Possible values
|
|
margin $
|
<selector>{margin:<value>} |
<length>**, <percentage>**, auto(sequence: t r b l) |
|
|
margin-top
|
<selector>{margin-top:<value>} |
<length>**, <percentage>, auto |
|
|
Margin-right
|
<selector>{margin-right:<value>} |
<length>, <percentage>, auto |
|
|
margin-bottom
*
|
<selector>{margin-bottom:<value>} |
<length>*, <percentage>*, auto*
|
|
|
margin-left
|
<selector>{margin-left:<value>} |
<length>, <percentage>, auto |
|
|
padding $
*
|
<selector>{padding:<value>} |
<length>*, <percentage>*, (sequence: t r b l) |
|
|
padding-top
*
|
<selector>{padding-top:<value>} |
<length>*, <percentage>*
|
|
|
padding-right
*
|
<selector>{padding-right:<value>} |
<length>*, <percentage>*
|
|
|
padding-bottom
*
|
<selector>{padding-bottom:<value>} |
<length>*, <percentage>*
|
|
|
padding-left
*
|
<selector>{padding-left:<value>} |
<length>*, <percentage>*
|
|
|
border-color
*
|
<selector>{border-color:<value>} |
<color>*
|
|
|
border-style
*
|
<selector>{border-style:<value>} |
solid*, double*, groove*, ridge*, inset*, outset
*
|
|
|
border $
*
|
<selector>{border:<value>} |
<border-width>*, <border-style>*, <color>
|
|
Block-level and Replaced Elements
|
|
width
|
<selector>{width:<value>} |
<length>, <percentage>, auto |
|
|
height
|
<selector>{height:<value>} |
<length>, auto |
|
|
float
|
<selector>{float:<value>} |
left, right |
|
|
clear
|
<selector>{clear:<value>} |
none, left*, right*
|
|
Position (CSS - P)
|
Name of
Property
|
Rule syntax
|
Possible values
|
|
position
|
<selector>{position:<value>} |
absolute, relative |
|
|
top
|
<selector>{top:<value>} |
<length>, <percentage>, auto |
|
|
left
|
<selector>{left:<value>} |
<length>, <percentage>, auto |
|
|
visibility
|
<selector>{visibility:<value>} |
hidden, visible, inherit |
|
|
z-index
|
<selector>{z-index:<value>} |
<number>, auto |
|
|
overflow
|
<selector>{overflow:<value>} |
visible, hidden, auto |
|
|
* = Not supported on IE 4/Mac
** = Buggy on IE 4/Mac
~ = Partially supported on IE 4/Mac
~~ = Partially supported on all 4 browsers
$ = Shorthand Property
|