css Selectors
Boxes
Box Model
*
All elements
div
<div>
div *
margin x
border-color x
margin-top
border-top-color
All elements within <div>
margin-right
border-right-color
div span
<span> within <div>
margin-bottom
border-bottom-color
div, span
<div> and <span>
margin-left
border-left-color
div > span
<span> with parent <div>
padding x
border-style x
div + span
<span> preceded by <div>
padding-top
border-top-style
.class
Elements of class "class"
padding-right
border-right-style
div.class
<div> of class "class"
padding-bottom
border-bottom-style
#itemid
Element with id "itemid"
padding-left
border-left-style
div#itemid
<div> with id "itemid"
border x
border-width x
a[attr]
<a> with attribute "attr"
border-top x
border-top-width
a[attr='x']
<a> when "attr" is "x"
border-bottom x
border-right-width
a[class~='x']
<a> when class is a list
border-right x
border-bottom-width
border-left x
border-left-width
containing 'x' a[lang|='en']
<a> when lang begins "en"
Pseudo-Selectors and Pseudo-Classes
Margin
Visible Area
Height
Border
Width
Padding
Positioning display
clear
position
z-index
top
Tables
direction +
caption-side +
border-spacing +
:first-child
First child element
right
unicode-bidi
table-layout
empty-cells +
:first-line
First line of element
bottom
overflow
border-collapse +
speak-header +
:first-letter
First letter of element
left
clip
:hover
Element with mouse over
float
visibility
:active
Active element
:focus
Element with focus
:link
Unvisited links
:visited
Visited links
width
:lang(var)
Element with language "var"
:before :after
size
page-break-inside +
marks
page +
min-height
page-break-before
orphans +
min-width
max-height
page-break-after
widows +
Before element
max-width
vertical-align
After element
height
Dimensions
Interface
Sizes and Colours
Color / Background
0
color +
background-repeat
0 requires no unit
Relative Sizes em
Paging
background x
background-image
1em equal to font size of
background-color
background-position
parent (same as 100%)
background-attachment
ex
Height of lower case "x"
%
Percentage
Absolute Sizes px
Pixels
cm
Text
cursor +
outline-style
outline x
outline-color
outline-width Aural volume +
elevation
speak +
speech-rate
pause x
voice-family
word-spacing +
pause-before
pitch
Centimeters
text-indent + Text text-align +
text-transform +
pause-after
pitch-range
mm
Millimeters
text-decoration
white-space +
cue x
stress
in
Inches
text-shadow
line-height +
cue-before
richness
pt
1pt = 1/72in
letter-spacing +
cue-after
speak-punctuation
pc
1pc = 12pt
play-during
speak-numeral
Colours
azimuth +
Fonts
#789abc
RGB Hex Notation
#acf
Equates to "#aaccff"
font + x
font-weight +
rgb(0,25,50)
Value of each of red, green,
font-family +
font-stretch +
and blue. 0 to 255, may be
font-style +
font-size +
content
list-style-type +
swapped for percentages.
font-variant +
font-size-adjust +
quotes +
list-style-image +
counter-reset
list-style-position +
counter-increment
marker-offset
Note
Shorthand properties are marked x Properties that inherit are marked +
Available free from www.AddedBytes.com
Miscellaneous
list-style + x