Reference CSS Properties
A quick reference for CSS Properties
| Property | Values | Initial Value | Inherited | Applies To | Notes |
|---|---|---|---|---|---|
| display | block | inline | list-item | none | block | no | all elements | |
| text-indent | <length> | <%> | 0 | yes | block-level elements | % values refer to parent element’s width |
| text-align | left | center | right | justify | browser | yes | block-level elements | |
| white-space | pre | nowrap | normal | normal | no | block-level elements | |
| line-height | <length> | <%> | <number> | normal | normal | yes | all elements | % values are relative to the font size of the element |
| vertical-align | baseline | sub | super | bottom | text-bottom | middle | top | text-top | <%> | baseline | no | inline elememts | % values refer to the line-height of the element |
| word-spacing | <length> | normal | normal | yes | all elements | |
| letter-spacing | <length> | normal | normal | yes | all elements | |
| margin-top, right, bottom, left | <length | <%> | auto | 0 | no | all elements | {margin: 0 0 2 4;} combines all four in top, right, bottom, left order |
| text-transform | uppercase | lowercase | capitalize | none | none | yes | all elements | |
| font-family | <family-name> | <generic-family> | browser | yes | all elements | |
| font-weight | normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | normal | yes | all elements | |
| font-size | xx-small | x-small | small | medium | large | x-large | xx-large | smaller | larger | <length> | <%> | medium | yes | all elements | % elements refer to parent element’s font size |
| font-style | italic | oblique | normal | normal | yes | all elements | |
| color (foreground) | <color> | browser | yes | all elements | color name, RGB or hexadecimal |
| background-color | <color> | transparent | transparent | no | all elements | |
| background-image | <url> | none | none | no | all elements | background-image:url(a.jpg) |
| background-repeat | repeat | repeat-x |repeat-y | no-repeat | no-repeat | no | all elements | |
| background-position | [<%> | <length>]{1,2} {top | center | bottom] || [left | center | right] | 0% 0% | no | block-level & replaced elements | % values refer to a point on both the element and the origin image. |
| background-attachment | scroll | fixed | scroll | no | all elements | |
| background | all of above | all elements | {background:white url (y.gif) top left repeat scroll;} |