Text
| font-family |
font used,e.g. Helvetica,Arial |
| font-size |
text-size,e.g. 60px 3em |
| color |
text color,e.g.#000, #abcdef |
| font-weight |
how bold the text is e.g bold |
| font-style |
what style the text is e.g. italic |
| text-decoration |
sets a variety of effects on text e.g. underline,overline,none |
| text-align |
how text is aligned, e.g. center |
| line-height |
spacing wetween line,e.g. 2em |
| letter-spacing |
spacing wetween letters, e.g. 5px |
| text-indent |
indent of the first line, e.g. 2em |
| text-transform |
applies formatting to text, e.g. upper-case,lowercase,capitalize |
| vertical-align |
align relative to baseline, e.g.text-top |
Border and Lists
| border |
sets border style for all borderin the format:border:
(solid,dashed,dotted,double)(width)(color),e.g.
border:solid 1px #000 |
| border-top |
sets border style for the top |
| border-bottom |
sets border style for the bottom |
| border-left |
sets border style for the left |
| border-right |
sets border style for the right |
| list-style-type |
sets style of bullets, e.g. square |
| list-style-position |
sets how text wraps when bulleted, e.g. outside, inside |
| list-style-image |
sets an image for a bullet, e.g. list-style-image:url(bullet.png) |
Positioning
| position |
places elements on screen, e.g. absolute, fixed, relative |
| float |
stacks elements horizontally in a particular direction, e.g. left |
| top,right,left,bottom |
specifies the offsets used in absolute,fixed, and relative positions, e.g.top:10px;left:10px |
| display |
sets how the element is placed in the doc flow, e.g. block, inline, none |
| z-index |
sets the stacking order of elements,e.g. z-index of 1 is below z-index of 2 |
| overflow |
sets what happens to content outside of container, e.g. auto, hidden |
Everything else
| background |
sets background of an element, in the
format: background: (color) (image)
(repeat) (position), e.g. background:
#000 url(bg.png) repeat-x top left |
| cursor |
sets shape of cursor, e.g. pointer |
| outline |
a border drawn around an element
that doesn’t affect the box model |
| border-collapse |
sets how borders within tables
behave, e.g. collapse |
| clear |
sets on what side a new line starts in
relation to nearby floated elements,
e.g. left, right, both |
