|
caption-side
clear float vertical-align |
background-attachment background-color background-image background-position background-repeat |
border border-color border-style border-width border-collapse |
font font-family font-size font-style font-variant font-weight |
a:link a:hover a:active a:visited |
|
list-style-image list-style-position list-style-type |
position left top z-index |
height width |
margin padding |
color letter-spacing line-height text-align text-decoration text-indent text-transform word-spacing |
Styles are applied to XHTML elements in the embedded format,
<style type="text/css">
selector {property:value [; property:value]...}
</style>
where the selector can be:
| simple selector | h1 {property:value [; property:value]...} |
| multiple selectors | h1, h2, h3 {property:value [; property:value]...} |
| id selector | span#id {property:value [; property:value]...} |
| contextual selector | ol li {property:value [; property:value]...} |
| class selector | .name {property:value [; property:value]...} |
Styles can also be applied in the in-line format,
<tag style="property:value [; property:value]...">
| CSS Property | Value | Description |
|---|---|---|
| Align | ||
| caption-side | top bottom |
Positions a table caption above or below a table. |
| clear | both left right none |
Sets whether the element is positioned in-line with a floating element or is positioned at the next clear line of the document. |
| float | left right none |
Sets whether the element floats to permit wrapping of accompanying content. |
| vertical-align | bottom top baseline middle sub super text-bottom text-top |
Sets the vertical alignment of the contents of the element. |
| Top | ||
| Background | ||
| background-attachment | fixed scroll |
Sets how a background image is attached to the document. |
| background-color | colorname #hexvalue rgb(r g b) rgb(r% g% b%) |
Sets the color of the background for the element. |
| background-image | url(url) none |
Sets the background image for an element. |
| background-position | left% top% left top left|center|right top|center|bottom |
Sets the location of the left and top edges of the background image for an element as percentages or measurements. Can use a pair of keywords separated by a space. |
| background-repeat | no-repeat repeat repeat-x repeat-y |
Sets whether the background image repeats horizontally, vertically, in both directions, or not at all. |
| Top | ||
| Border | ||
| border |
style width color | Sets the border style, width, and color with a single property. |
| border-color border-top-color border-right-color border-bottom-color border-left-color |
colorname #hexvalue rgb(r g b) rgb(r% g% b%) |
Sets the color of all borders or a single border edge of an element. |
| border-style border-top-style border-right-style border-bottom-style border-right-style |
dashed dotted double groove inset none outset ridge solid |
Sets the style of all borders or a single border edge of an element. |
| border-width border-top-width border-right-width border-bottom-width border-right-width |
thin medium thick width |
Sets the width of all borders or a single border edge of an element using a keyword or a width measurement. |
| border-collapse | collapse separate |
Sets whether adjacent table cells are rendered separately or merged into a single border. |
| Top | ||
| Font | ||
| font | style variant weight size family | Sets multiple font properties, separated by spaces, in the exact order shown. Not all properties need to be set. |
| font-family | name [,name]... serif sans-serif cursive fantasy monospace |
Sets one or more font names or generic name for the element's text. |
| font-size | npx n% xx-small x-small small medium large x-large xx-large |
Sets the font size for the element's text. |
| font-style | normal italic oblique |
Sets the font style for the element's text. |
| font-variant | normal small-caps |
Sets the font variant for the element's text. |
| font-weight | normal bold bolder lighter 100 - 900 |
Sets the font weight for the element's text. |
| Top | ||
| Link | ||
|
a:link a:hover a:active a:visited |
Any text stylings. | Sets how a text links responds to mouse activation. |
| Top | ||
| List | ||
| list-style-image | none url(url) |
Sets the image used as the bullet character for list items. |
| list-style-position | inside outside |
Sets the alignment of wrapped text for a list item. Inside aligns wrapped text with the item marker; outside aligns wrapped text with the beginning text position. |
| list-style-type | circle disc square decimal lower-alpha lower-roman upper-alpha upper-roman |
Sets the list item marker for unordered lists and for ordered lists. |
| Top | ||
| Position | ||
| position | relative fixed |
Sets the element's location in the document. Fixed positioning is relative to the top-left corner (0,0 pixel position) of the container element. |
| left | npx n% |
Sets the distance of a element from the left margin of its container. |
| top | npx n% |
Sets the distance of a element from the top margin of its container. |
| z-index | n | Sets the layer of a element. Elements with smaller numeric values appear below elements with larger values. Zero (0) is the text layer. |
| Top | ||
| Size | ||
| height | auto npx n% |
Sets the height of an element. |
| width | npx n% auto |
Sets the width of the element. |
| Top | ||
| Spacing | ||
| margin margin-top margin-right margin-bottom margin-left |
auto npx n% |
Sets the amount of space that extends beyond the edges of an element. |
| padding padding-top padding-right padding-bottom padding-left |
auto npx n% |
Sets the amount of space surrounding the contents of an element. |
| Top | ||
| Text | ||
| color | colorname #hexvalue rgb(r g b) rgb(r% g% b% |
Sets the text color of the element. |
| letter-spacing | normal npx auto |
Sets the horizontal letter spacing of an element's text. Measurement can be negative. |
| line-height | normal n npx n% |
Sets the line height of an element's text. A number serves as a multiplier of the current font size; a measurement is an actual height value; a percentage is a multiplier of the current font size. |
| text-align | left center right justify |
Sets the horizontal alignment of text within an element. |
| text-decoration | none blink line-through overline underline |
Sets the decoration of text within an element. |
| text-indent | npx n% |
Sets the indention of text within an element. |
| text-transform | none captialize lowercase uppercase |
Sets the capitalization of text within an element. |
| word-spacing | npx normal |
Sets the amount of spacing between words of the element. |
| Top | ||