| font-family | p {font-family: Arial, serif} | ||
| font-style | normal italic oblique | p {font-style: italic} | |
| font-variant | normal small-caps | p {font-variant: small-caps} | |
| font-weight | normal lighter bold bolder 100-900 | 100- , 900- | p {font-weight: bold} |
| font-size | normal pt px % | font-size: normal font-size: 12pt font-size: 12px font-size: 120% |
| line-height | normal % | ( ) | line-height: normal line-height: 1.5 line-height: 12px line-height: 120% |
| text-decoration | none underline overline line-through blink | text-decoration: none | |
| text-transform | none capitalize uppercase lowercase | text-transform: capitalize | |
| text-align | left right center justify | text-align: justify | |
| text-indent | % | text-indent:15px; | |
| color | white #ffffff RGB(255,255,255) RGB(100%,100%,100%) | color:#ffffff; |
| background-color | transparent | BODY { background-color: #6699FF } | |
| background-image | URL none | BODY { background-image: url (bg.gif) } | |
| background-repeat | repeat repeat-x repeat-y no-repeat | BODY { background-image: url (bg.gif) background-repeat: repeat-y } | |
| background-attachment | scroll fixed | BODY { background-image: url (bg.gif) background-attachment: fixed } | |
| background-position | top center bottom left right | BODY { background-position: left top } |
CSS .
1. .
P { color: navy; background-color: yellow }
2. , HTML.
P { color: #F9E71A; background-color: #98560F }
3. , . 0 255. .
P { color: RGB(249, 231, 16); background-color: RGB(85%, 24%, 5%) }
CSS , A . 1 .
|
|
|
| A:link | . |
| A:visited | . |
| A:active | . . |
| A:hover | . |
| CSS | |
| cursor:default |
| cursor:crosshair |
| cursor:hand |
| cursor:move |
| cursor:text |
| cursor:wait |
| cursor:help |
| cursor:n-resize |
| cursor:ne-resize |
| cursor:e-resize |
| cursor:se-resize |
| cursor:s-resize |
| cursor:sw-resize |
| cursor:w-resize |
|
| cursor:nw-resize |
| list-style | disc circle square decimal lower-roman upper-roman lower-alpha upper-alpha none | . , . | LI {list-style: circle} LI {list-style: upper-alpha} |
| list-style-image | none URL | . | LI {list-style-image: url(check.gif)} |
| list-style position | outside inside | . | LI {list-style-position: inside;} |
list-style:
| HTML | |
| <li style="list-style: disc"> | |
| <li style="list-style: circle"> | |
| <li style="list-style: square"> | |
| <li style="list-style: decimal"> | |
| <li style="list-style: lower-roman"> | |
| <li style="list-style: upper-roman"> | |
| <li style="list-style: lower-alpha"> | |
| <li style="list-style: upper-alpha"> |
| padding-top padding-right padding-bottom padding-left padding | % | table {padding: 15px 15px} | |
| border-top-width border-right-width border-bottom-width border-left-width border-width | thin medium thick | P {border-top-width: 4px} | |
| border-color | P {border-color: red} | ||
| border-top-style border-right-style border-bottom-style border-left-style border-style | none dotted dashed solid double groove ridge inset outset | table {border-style: double} | |
| border-top border-right border-bottom border-left | border-width border-style | , | table {border-top: solid 4px red; border-left: solid 4px blue} |
| border | . | , | table {border: solid 4px red} |
border-style:
, CSS . , .
|
|
|
em , ( font-size). , , . 1em , . em, , 1em 100% .
ex x . ex , em, , , , .
, , , . .
| em | |
| ex | x |
| px | |
| % |
, . , , , . , , , , .
| in | (1 2,54 ) |
| cm | |
| mm | |
| pt | (1 1/72 ) |
| pc | (1 12 ) |
, , , , .
CSS .
| W3C | ||||
| bottom | auto % | CSS2 | . | P { bottom: 20% } |
| clip | auto | CSS2 | . | P { clip: rect(10px 110px 80px 20px) } |
| left | auto % | CSS2 | . | P { left: -100px } |
| overflow | visible hidden scroll auto | CSS2 | , . | DIV {overflow: scroll } |
| right | auto % | CSS2 | . | P { right: 20px } |
| top | auto % | CSS2 | . | P { top: 50% } |
| vertical-align | baseline sub super top text-top middle bottom text-bottom % | CSS1 | . | SPAN.sup {vertical-align: super } |
| z-index | auto | CSS2 | . | .top { z-index: 10 } |
position, absolute () relative ().
left top (. 1). , (. 2).
. 1.
position: relative (. 2). , top left, .
|
|
|
. 2.
- bottom right, . , , , . left top ( 2).
, , . 3.
. 3.
.
overflow , . overflow .
visible , .
hidden , .
scroll .
auto .
