| Property | Values | Usage and Browser Issues1 | CSS1 Ref |
|---|---|---|---|
| font-family | Comma-delimited list. Final value should be one of the generic font names: serif, sans-serif, cursive, fantasy, monospace | (Windows only in IE 3) | 5.2.2 |
| font-style | normal, italic, oblique | | 5.2.3 |
| font-variant | normal, small-caps | | 5.2.4 |
| font-weight | 100-900, bold, normal, lighter, bolder | Browser support is all over the map. The numbers are not supported well at all. Suggest using BOLD only. Bolder and lighter are relative to parent weight. | 5.2.5 |
| font-size | Absolute: {xx-small, x-small, small,
medium, large, x-large, xx-large}. Exact: 12pt, 30px, etc. | | 5.2.6 |
| font | [Short-hand notation to combine above properties.] Example: { font: x-large italic "sans serif" } | Does not work correctly in any of the
tested browsers! Specifying each property separately worked much better. | 5.2.7 |
| color | {color} | | 5.3.1 |
| background-color | transparent, {color} | | 5.3.2 |
| background-image | url(), none | | 5.3.3 |
| background-repeat | repeat, repeat-x, repeat-y, no-repeat | | 5.3.4 |
| background-attachment | scroll, fixed | | 5.3.5 |
| background-position | | | 5.3.6 |
| background | [Shorthand for above 5 properties.] | | 5.3.7 |
| word-spacing | normal, {length} | In addition to default. | 5.4.1 |
| letter-spacing | normal, {length} | In addition to default. | 5.4.2 |
| text-decoration | none, underline, overline, line-through, blink | | 5.4.3 |
| vertical-align | baseline, sub, super, top, text-top, middle, bottom, text-bottom, {percentage} | | 5.4.4 |
| text-transform | none, capitalize, uppercase, lowercase | | 5.4.5 |
| text-align | left, center, right, justify | | 5.4.6 |
| text-indent | {length}, {precentage} | | 5.4.7 |
| line-height | normal, {number}, {length}, {percentage} | | 5.4.8 |
1. Empty implies MSIE 3+ and Navigator 4+ support. Parentheticals imply support except as noted.
| Property | Values | Usage and Browser Issues1 | CSS1 Ref |
|---|---|---|---|
| margin-top margin-right margin-bottom margin-left | auto, {length}, {percentage} | | 5.5.1 5.5.2 5.5.3 5.5.4 |
| margin | auto, {length}, {percentage} | Shorthand for setting all four margins at once. | 5.5.5 |
| padding-top padding-right padding-bottom padding-left | {length}, {percentage} | | 5.5.6 5.5.7 5.5.8 5.5.9 |
| padding | 0, {length}, {percentage} | Shorthand for setting all four settings above at once. | 5.5.10 |
| border-width | thin, medium, thick, {length} | Also border-right-width, etc. | 5.5.11-5.5.15 |
| border-color | {color} | Can specify 4 colors in list. | 5.5.16 |
| border-style | none, dotted, dashed, solid, double, groove, ridge, inset, outset | | 5.5.17 |
| border-top border-right border-bottom border-left | [Shorthand for above three properties.] | | 5.5.18-5.5.21 |
| border | [Shorthand for entire border.] | | 5.5.22 |
| width | {length}, {percentage}, auto | | 5.5.23 |
| height | {length}, auto | | 5.5.24 |
| float | left, right, none | | 5.5.25 |
| clear | none, left, right, both | Sides where floating elements are allowed. | 5.5.26 |
1. Empty implies MSIE 3+ and Navigator 4+ support. Parentheticals imply support except as noted.
| Property | Values | Usage and Browser Issues1 | CSS1 Ref |
|---|---|---|---|
| display | block, inline, list-item, none | Note: list-item's are generally like blocks. | 5.6.1 |
| white-space | normal, pre, nowrap | | 5.6.2 |
| list-style-type | disc, circle, square, decimal, lower-roman, lower-alpha, upper-alpha, none | "None" can be used for some wrapping effects. | 5.6.3 |
| list-style-image | none, {url} | | 5.6.4 |
| list-style-position | inside, outside | | 5.6.5 |
| list-style | [Any combination of above 3 properties.] | | 5.6.6 |
1. Empty implies MSIE 3+ and Navigator 4+ support. Parentheticals imply support except as noted.
| Embedded Styles | Must be in the <HEAD> section. Example format:
<STYLE TYPE="text/css"><!--
/* Example: HTML Element Selector */
H1 { text-align: center; font-size: xx-large; }
/* Example: Grouping HTML Element Selectors */
H2, H3 { text-align: left; color: green; }
H2 {font-size: x-large; }
H3 {font-size: large; }
/* Example: Contextual Selector */
TD EM { text-variant: small-caps; }
/* Applies only yo EM's within TD's. */
/* Example: Class Selectors */
.typical { font-size: small; }
/* Any element with CLASS="typical". */
P.typical { text-align: left; }
/* Applies only to paragraphs. */
A.typical:visited { color: magenta; }
/* Proper syntax for pseudo-class reference. */
/* Example: ID Selectors */
#appendix2 { font-family: monospace; }
--></STYLE>
|
| Linked Styles | Must be in the <HEAD> section. Example format:
<LINK REL="stylesheet" TYPE="text/css" HREF="default.scc"> |
| In-Line Styles | Use STYLE tag of many HTML elements. Separate properties
with semi-colons. Example format:
<P STYLE='font-size:x-small; color:red'> |