Previous Page
Next Page

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>



Previous Page
Next Page