C. Cascading Style Sheets Reference

This appendix lists the CSS2 properties as defined by the W3C at http://www.w3.org/TR/REC-CSS2. The specification was standardized all the way back in May 1998, but as of this writing, many of these properties aren't implemented in any browser. The next version, CSS 2.1, was still at the Working Draft stage at the time this was written. The goal of the CSS 2.1 specification is to clarify CSS2 so that it is closer to what browser makers have actually implemented. This list is complete except for the aural properties (those used for speech synthesis for the visually disabled), which are not (at this time) modifiable by JavaScript.

Because this is a book about JavaScript, we've only touched on a few of the cool things you can do with CSS. If you want to learn more, we recommend Cascading Style Sheets: The Definitive Guide, Second Edition, by Eric A. Meyer. The book lives up to its name, with exhaustive descriptions of CSS1 and CSS2. The in-progress CSS 2.1 standard is also discussed in the book.

Table C.1. Basic Concepts

Property Name	Value
In HTML	link
	<style>...</style>
	< x style= "declaration;">
Grouping	x, y, z {declaration;}
Contextual selectors	x y z {declaration;}
Class selector	.class
ID selector	#ID
At-rules	@import
	@font-face
	@media
	@page
Important	!important

Table C.2. Pseudo-Elements and Pseudo-Classes

Property Name	Value
after	:after
anchor	a:active
	a:focus
	a:hover
	a:link
	a:visited
before	:before
first	:first
first-child	:first-child
left	:left
paragraph	p:first-letter
	p:first-line
right	:right

Table C.3. Color and Background Properties

Property Name	Value
background	< background-color>
	< background-image>
	< background-repeat>
	< background-attachment>
	< background-position>
background-attachment	scroll
	fixed
background-color	< color>
	transparent
background-image	< url>
	none
background-position	< percentage>
	< length>
	top
	center
	bottom
	left
	right
background-repeat	repeat
	repeat-x
	repeat-y
	no-repeat
color	< color>

Table C.4. Font Properties

Property Name	Value
font	< font-style>
	< font-variant>
	< font-weight>
	< font-size> / < line-height>
	< font-family>
	caption
	icon
	menu
	message-box
	small-caption
	status-bar
font-family	< family-name>
	cursive
	fantasy
	monospace
	sans-serif
	serif
font-size	< absolute-size> (xx-smallxx-large)
	< relative-size> (smallerlarger)
	< length>
	< percentage>
font-size-adjust	< number>
	none
font-stretch	normal
	wider
	narrower
	ultra-condensed
	extra-condensed
	condensed
	semi-condensed
	semi-expanded
	expanded
	extra-expanded
	ultra-expanded
font-style	normal
	italic
	oblique
font-variant	normal
	small-caps
font-weight	normal
	bold
	bolder
	lighter
	100 900

Table C.5. Text Properties

Property Name	Value
content	< string>
	< url>
	< counter>
	open-quote
	close-quote
	no-open-quote
	no-close-quote
counter-increment	< identifier>
	< integer>
	none
counter-reset	< identifier>
	< integer>
	none
direction	ltr
	rtl
letter-spacing	normal
	< length>
line-height	normal
	< number>
	< length>
	< percentage>
quotes	< string>
	none
text-align	left
	right
	center
	justify
text-decoration	none
	underline
	overline
	line-through
	blink
text-indent	< length>
	< percentage>
text-shadow	none
	< color>
	< length>
text-transform	capitalize
	uppercase
	lowercase
	none
unicode-bidi	normal
	embed
	bidi-override
vertical-align	baseline
	sub
	super
	top
	text-top
	middle
	bottom
	text-bottom
	< percentage>
	< length>
white-space	normal
	pre
	nowrap
word-spacing	normal
	< length>

Table C.6. Box Properties

Property Name	Value
border	< border-width>
	< border-style>
	< color>
border-bottom	< border-width>
	< border-style>
	< color>
border-bottom-color	< color>
border-bottom-style	< border-style>
border-bottom-width	< border-width>
border-collapse	collapse
	separate
border-color	< color>
	transparent
border-left	< border-top-width>
	< border-style>
	< color>
border-left-color	< color>
border-left-style	< border-style>
border-left-width	< border-width>
border-right	< border-top-width>
	< border-style>
	< color>
border-right-color	< color>
border-right-style	< border-style>
border-right-width	< border-width>
border-spacing	< length>
border-style	none
	dotted
	dashed
	solid
	double
	groove
	ridge
	inset
	outset
border-top	< border-top-width>
	< border-style>
	< color>
border-top-color	< color>
border-top-style	< border-style>
border-top-width	< border-width>
border-width	thin
	medium
	thick
	< length>
bottom	< length>
	< percentage>
clear	none
	left
	right
	both
float	left
	right
	none
height	< length>
	< percentage>
	auto
margin	< margin-width>
margin-bottom	< margin-width>
margin-left	< margin-width>
margin-right	< margin-width>
margin-top	< margin-width>
max-height	< length>
	< percentage>
	none
max-width	< length>
	< percentage>
	none
min-height	< length>
	< percentage>
min-width	< length>
	< percentage>
padding	< padding-width>
padding-bottom	< padding-width>
padding-left	< padding-width>
padding-right	< padding-width>
padding-top	< padding-width>
width	< length>
	< percentage>
	auto

Table C.7. Positioning Properties

Property Name	Value
caption-side	top
	bottom
	left
	right
clip	auto
	< shape>
display	block
	inline
	list-item
	run-in
	compact
	marker
	table
	inline-table
	table-row-group
	table-header-group
	table-footer-group
	table-row
	table-column-group
	table-column
	table-cell
	table-caption
	none
empty-cells	show
	hide
left	< length>
	< percentage>
	auto
overflow	visible
	hidden
	scroll
	auto
position	static
	absolute
	relative
	fixed
right	< length>
	< percentage>
	auto
table-layout	auto
	fixed
top	auto
	< length>
	< percentage>
visibility	collapse
	visible
	hidden
z-index	auto
	< integer>

Table C.8. List Properties

Property Name	Value
list-style	< list-style-type>
	< list-style-position>
	< list-style-image>
list-style-image	< url>
	none
list-style-position	inside
	outside
list-style-type	disc
	circle
	square
	decimal
	decimal-leading-zero
	lower-roman
	upper-roman
	lower-greek
	lower-alpha
	lower-latin
	upper-alpha
	upper-latin
	hebrew
	armenian
	georgian
	cjk-ideographic
	hiragana
	katakana
	hiragana-iroha
	katakana-iroha
	none

Table C.9. Page Properties

Property Name	Value
marks	crop
	cross
	none
orphans	< integer>
page	< identifier>
	auto
page-break-after	auto
	always
	avoid
	left
	right
page-break-before	auto
	always
	avoid
	left
	right
page-break-inside	avoid
	auto
size	< length>
	auto
	portrait
	landscape
widows	< integer>

Table C.10. User Interface Properties

Property Name	Value
cursor	< url>
	auto
	crosshair
	default
	pointer
	move
	e-resize
	ne-resize
	nw-resize
	n-resize
	se-resize
	sw-resize
	s-resize
	w-resize
	text
	wait
	help
outline	< outline-color>
	< outline-style>
	< outline-width>
outline-color	< color>
	invert
outline-style	< border-style>
outline-width	< border-width>

Table C.11. Units

Property Name	Value
Length Units	em
	ex
	px
	in
	cm
	mm
	pt
	pc
Color Units	#000
	#000000
	(RRR,GGG,BBB)
	(R%,G%,B%)
	< keyword>
URLs	< url>