CSS CHEAT SHEET

Shorthand* SYNTAX BOX MODEL

background Syntax height; width; margin-top;
border margin-right; margin-bottom;
selector {property: value;}
border-bottom margin-left; padding-top;
border-left External Style Sheet padding-right; padding-bottom;
border-right <link rel="stylesheet" type="text/css" padding-left;
border-top href="style.css" />
font
list-style Internal Style
margin <style type="text/css">
padding selector {property: value;}
</style>
Comments Inline Style
BORDER
/* Comment */ <tag style="property: value">
border-width Width of the border
Pseudo border-style dashed; dotted; double; groove; inset; outset; ridge;
Selectors GENERAL solid; none

:hover Class String preceded by a period border-color Color of the border

:active ID String preceded by a hash mark
:focus div Formats structure or block of text POSITION
:link
:visited span Inline formatting clear Any floating elements around the element?
:first-line color Foreground color both, left, right, none
:first-letter float Floats to a specified side
cursor Appearance of the cursor
display left, right, none
Media block; inline; list-item; none
left The left position of an element
Types overflow How content overflowing its box is
handled auto, length values (pt, in, cm, px)
all
braille visible, hidden, scroll, auto top The top position of an element
embossed visibility visible, hidden auto, length values (pt, in, cm, px)
handheld
print position static, relative, absolute
projection FONT z-index Element above or below overlapping elements?
screen
font-style Italic, normal auto, integer (higher numbers on top)
speech
tty font-variant normal, small-caps
tv BACKGROUND
font-weight bold, normal, lighter, bolder, integer
(100-900) background-color Background color
Units
background-image Background image
Length % font-size Size of the font
em background-repeat repeat, no-repeat, repeat-x, repeat-y
font-family Specific font(s) to be used
pt background-attachment Background image scroll with the
px element?
Keywords TEXT
scroll, fixed
bolder letter-spacing Space between letters
lighter background-position (x y), top, center, bottom, left, right
line-height Vertical distance between
larger
baselines
text-align Horizontal alignment LIST
text-decoration blink, line-through, none, overline, list-style-type Type of bullet or numbering in the list
underline disc; circle; square; decimal; lower-roman;
text-indent First line indentation upper-roman; lower-alpha; upper-alpha; none

text-transform capitalize, lowercase, uppercase list-style-position Position of the bullet or number in a list
inside; outside
vertical-align Vertical alignment
list-style-image Image to be used as the bullet in a list
word-spacing Spacing between words
* The properties for each selector are in the order they should appear when using shorthand notation.