Reference Stylesheets Guide CSS Examples
| Style rules | Comments | |
| p | {font-family: Helvetica, Geneva; | Of those listed, the first available font will be applied. |
| font-style: italic; | Text will be rendered as italic. | |
| font-weight: bold; | Text will be rendered as bold. | |
| font-size: 10pt; | Text will be rendered as 10-point type. | |
| color: #00FFFF; | Text will be rendered to the hex color value #00FFFF. | |
| background-color: blue; | The element's background color will be rendered as blue. | |
| background-image: url(images/foo.gif)} | The element will have the background image(s) specified. | |
|
|
||
| .foo | {text-decoration: underlined} | Text in the class "foo" will be underlined. |
| {text-transform: lowercase} | Text in the class "foo" will be rendered as lowercase. | |
|
|
||
| #foo | {text-align: center} | Text with the ID "foo" will be center-aligned. |
| {text-indent: 1em} | Text with the ID "foo" will be indented 1 em. | |
|
|
||
| p | {margin-top: 12px; | The element's top margin will be 12 pixels. |
| margin-bottom: 18px; | The element's bottom margin will be 18 pixels. | |
| padding-right: 8pt; | The element's right padding will be 8 points. | |
| padding-left: 4pt} | The element's left padding will be 4 points. | |
|
|
||
| body | {border-color: red; | Borders will be red. |
| border-style: solid} | Borders will be solid. | |
| Block-level and replaced elements | ||
| img | {width: 20px; | The element's width will be 20 pixels. |
| height: 40px; | The element's height will be 40 pixels. | |
| float: left} | Text will flow to the left of the element. | |
|
|
||
| p | {clear: left} | Moves the element below a floating element placed on the left. |
| Shorthand Properties | ||
| Style rules | Comments | |
| p | {font: 10pt bold non-serif} | Text will be rendered as 10-point bold non-serif type. |
| {background: black} | The element's background color will be black. | |
| {margin: 25px} | All of the element's margins will be 25 pixels. | |
| {margin: 20px 10px 20px 10px} | Top and bottom margins will be 20 pixels; left and right margins will be 10 pixels. | |
|
|
||
| body | {padding: 2px} | Padding will be 2 pixels on each side. |
| {padding: 8px 4px 8px 4px} | Top and bottom padding will be 8 pixels; left and right padding will be 4 pixels. | |
| {border: 2px solid red} | There will be a red, solid border on all sides of the element. | |
| Position (CSS - P) | ||
| Style rules | Comments | |
| #foo | {position: absolute; top: 15pt; left: 15pt} | The element's absolute position will be set 15 points from the top and 15 points from the left. |
| {visibility: hidden} | The element's contents will be hidden. | |
|
|
||
| .foo | {z-index: 2} | The element's z-index will be two. |
|
|
||
| p | {overflow: visible} | The element's contents will be rendered (visible) even if they exceed its height or width. |
| {overflow: hidden} | The element's contents will be clipped to its height and width, and no scrolling mechanism will be provided. | |
|
|
||