Quick Reference to Cascading Style Sheets, level 1
Based on W3C Working Draft 05-May-96
- This version is based on:
- http://www.w3.org/pub/WWW/TR/WD-css1-960505.html
- Latest version:
- http://www.w3.org/pub/WWW/TR/WD-css1.html
- Author:
-
Steven Pemberton
(Steven.Pemberton@cwi.nl)
Syntax
- a b c
- a is followed by b is followed by c, in that order.
- a | b
- either a or b must occur
- a || b
- either a or b or both must occur, in any order
- [a b]
- brackets, used for grouping
- a?
- a is optional
- a+
- a is repeated 1 or more times
- a{1,4}
- a is repeated at least once and at most 4 times.
Juxtaposition is stronger than the double bar,
and the double bar is stronger than the bar.
Thus "a b | c || d e" is equivalent to "[ a b ] | [ c || [ d e]]".
Definitions
- Block-level elements
-
an element which has a line break before and after (e.g. <H1>, <P>)
- Replaced element
-
An element which is replaced by content pointed to from the
element. E.g., <IMG>.
Properties
In each definition
- the default value is shown in bold, or given separately
- values apply to all elements unless otherwise stated
- properties are inherited unless the property name is marked with a star "*".
- 5.2.2 font-size
-
<length> | <percentage> | <number> | xx-small | x-small | small | medium | large | x-large | xx-large
Percentage values: relative to parent's font size
- 5.2.3
font-family
-
[[<family-name> | serif | sans-serif | cursive | fantasy | monospace],]* [<family-name> | serif | sans-serif | cursive | fantasy | monospace ]
Initial: UA specific
- 5.2.4 font-weight
-
extra-light | light | demi-light | medium | demi-bold | bold | extra-bold | bolder | lighter
- 5.2.5 font-style
-
normal | italic || small-caps | oblique || small-caps | small-caps
- 5.2.6 line-height
-
<number> | <length> | <percentage>
Initial: UA specific
Percentage values: refers to the font size of the element itself
- 5.2.7 font
-
[<font-weight> || <font-style>]? <font-size> [ / <line-height> ]? <font-family>
Initial: not defined
Percentage values: allowed on 'font-size' and 'line-height' only
- 5.3.1 color
-
<color>
Initial: UA specific
- 5.3.2 background*
-
transparent | <color> [ / <color> ]? || <url> || <blend-direction> || <repeat> || <scroll> || <position>
- <blend-direction>
- N | NW | W | SW | S | SE | E | NE
- <repeat>
- repeat | repeat-x | repeat-y | no-repeat
- <scroll>
- fixed | scroll
- <position>
- <percentage> | left | center | right [ <percentage> | top | middle | bottom]?
Initial value: 0% 0%
- 5.4.1 word-spacing
-
normal | <length>
- 5.4.2 letter-spacing
-
normal | <length>
- 5.4.3 text-decoration*
-
none | [ underline | overline | line-through | blink ]+
Not inherited, but see clarification
- 5.4.4 vertical-align
-
baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage>
Percentage values: refer to the 'line-height' of the element itself
- 5.4.5 text-transform
-
capitalize | uppercase | lowercase | none
- 5.4.6 text-align
-
left | right | center | justify
Initial: UA specific
Applies to: block-level elements
- 5.4.7 text-indent
-
<length> | <percentage>
Initial: 0
Applies to: block-level elements
Percentage values: refer to parent's width
- 5.5.1 padding*
-
[ <length> | <percentage> | auto ]{1,4}
Initial: 0
Applies to: all elements
Percentage values: refer to parent's width
- 5.5.2 margin-left*, margin-right*, margin-top*, margin-bottom*, margin*
-
[ <length> | <percentage> | auto ]{1,4} (for 'margin' property)
Initial: 0
Applies to: all elements
Percentage values: refer to parent's width
- 5.5.3 display*
-
block | inline | list-item | none
Initial: according to HTML
- 5.5.4 width*
-
<length> | <percentage> | auto
Applies to: all elements
Percentage values: refer to parent's width
- 5.5.5 height*
-
<length> | auto
Applies to: all elements
- 5.5.6 float*
-
left | right | none
Applies to: all elements
- 5.5.7 clear*
-
none | left | right | both
Applies to: all elements
- 5.5.3 border-top, border-right, border-bottom, border-left, border
-
<border-width> || <border-style> || <url> || <color>
Applies to: all elements
- <border-width>
- gthin | medium | thick | <length>
- <border-style>
- none | dotted | dashed | solid | double | groove | ridge | inset | outset
- 5.6.2 list-style
-
[ disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none ] || <uri>
Applies to: elements with 'display' property value 'list-item'
- 5.7.3 white-space
-
normal | pre
Initial: according to HTML
Applies to: block-level elements
- <length>
- <number><unit>
- <unit>
- <absolute-unit> | <relative-unit>
- <absolute-unit>
- mm | cm | in | pt | pc
- <relative-unit>
- em | ex | px
- <color>
- <color-name> | <rgb1> | <rgb2> | <rgb3>
- <color-name>
- The preliminary list of color names is included in the full version.
- <rgb1>
- #<hex><hex><hex>
- <rgb2>
- #<hex><hex><hex><hex><hex><hex>
- <rgb3>
- rgb <number> <number> <number>