| Text |
|---|
| color: #999999 | rgb(100,14,200) | menu | red |
Text color |
| font-family: cursive | fantasy | monospace | serif | sans-serif |
Text font |
| font-size: 12px | 20% |
Text size |
| font-style: normal | italic | oblique |
Text style |
| font-variant: normal | small-caps |
Wheather text consists of small capital letters |
| letter-spacing: 1pt |
Space between letters |
| line-height: normal | 150% |
Line height |
| font-weight: normal | bold | bolder | lighter | 500 |
Text weight |
| vertical-align: baseline |sub | super |top | text-top |middle |bottom |text-bottom |0 |-2.5 | 20% |
Vertical position of the text |
| text-decoration: none | underline | blink | overline | line-through |
Add a line to the text |
| text-transform: none | capitalize | uppercase | lowercase |
Change the form of the text |
| text-align: left | right | center | justify |
Horizonal position of the text |
| Background |
|---|
| background-color: transparent | #999999 | rgb(100,14,200) | menu | red |
Background color |
| background-repeat: repeat | no-repeat | repeat-x | repeat-y |
How to repeat the background |
| background-position: 35% 85% | 35% 2.5cm | 3.25in | top right |
Background position(single value will be applyed to X, and Y will then be set as 50%) |
| background-image: none | url(http://www.a.com/jpg) | url(images/a.jpg) |
Background image |
| background-attachment: scroll | fixed |
Wheather the background image can scroll with the content |
| Positioning |
|---|
| position: static | absolute | fixed | relative |
How to position the div |
| z-index: auto | 0 | 3 |
Overlappig oder |
| top: auto | -3px | 20% |
blank to the top, similar to right,bottom,left |
| Pseudo-Classes |
|---|
| a:link font-size: 14pt; text-decoration: underline; color: blue; |
What will happen with a link |
| (some selector):hover |
What will happen when mouse hovered |
| (some selector):active |
What will happen when some controller is actived |
| (some selector):visited |
What will happen when a link has been visiteed |
| (some selector):focus |
What will happen when the keyboard is focused on something |
| (some selector):first-letter |
What the first letter is like |
| (some selector):first-line |
What the first line is like |
| (some selector):first-child |
What the first child element is like |
| @page :first { margin: 4cm } |
What the first page is like |
For more information, refer to:http://www.divcss5.com/shouce/