Study hall: Learn about some nuts and bolts.
CSS 2 Properties
In case you haven’t seen what goes into cascading style sheets, here is a fairly complete list of the CSS 2 properties. What you don’t see here is every configuration option, or how to use them, which can be fun to figure out at times. Enjoy, if possible.
As noted in the lexicon, CSS is a handy way to format the appearance of web pages. A stylesheet is a set of rules, and each rule is a statement about style. Stylesheets “cascade” or inherit from one another, and because of this many stylesheets and mixtures of styles can apply to one web page.
| background | : | A shorthand property for setting all background properties in one declaration. Possible values: background-color, background-image, background-repeat, background-attachment, background-position. |
| border | : | A shorthand property for setting all of the properties for the four borders in one declaration. Possible values: border-width, border-style, border-color. |
| border-spacing | : | Sets the distance that separates cell borders. |
| bottom | : | Sets how far the bottom edge of an element is above/below the bottom edge of the parent element. |
| caption-side | : | Sets the position of the table caption. |
| clear | : | Sets the sides of an element where other floating elements are not allowed. |
| clip | : | Sets the shape of an element. The element is clipped into this shape, and displayed. |
| color | : | Sets the color of a text. |
| content | : | Generates content in a document. Used with the :before and :after pseudo-elements. |
| counter-increment | : | Sets how much the counter increments on each occurrence of a selector. |
| counter-reset | : | Sets the value the counter is set to on each occurrence of a selector. |
| cursor | : | Specifies the type of cursor to be displayed. |
| direction | : | Sets the text direction. |
| display | : | Sets how/if an element is displayed. |
| empty-cells | : | Sets whether or not to show empty cells in a table (only for the "separated borders" model). |
| float | : | Sets where an image or a text will appear in another element. |
| font | : | A shorthand property for setting all of the properties for a font in one declaration. Possible values: font-style, font-variant, font-weight, font-size/line-height, font-family, caption, icon, menu, message-box, small-caption, status-bar. |
| height | : | Sets the height of an element. |
| left | : | Sets how far the left edge of an element is to the right/left of the left edge of the parent element. |
| letter-spacing | : | Increase or decrease the space between characters. |
| line-height | : | Sets the distance between lines. |
| line-height | : | Sets the distance between lines. |
| list-style | : | A shorthand property for setting all of the properties for a list in one declaration. Possible values: list-style-type, list-style-position, list-style-image. |
| margin | : | A shorthand property for setting the margin properties in one declaration. Possible values: margin-top margin-right, margin-bottom, margin-left. |
| max-height | : | Sets the maximum height of an element. |
| max-width | : | Sets the maximum width of an element. |
| min-height | : | Sets the minimum height of an element. |
| min-width | : | Sets the minimum width of an element. |
| outline | : | A shorthand property for setting all the outline properties in one declaration. Possible values: outline-color outline-style outline-width. |
| overflow | : | Sets what happens if the content of an element overflow its area. |
| padding | : | A shorthand property for setting all of the padding properties in one declaration. Possible values: padding-top padding-right, padding-bottom, padding-left. |
| page-break-after | : | Sets the page-breaking behavior after an element. |
| page-break-before | : | Sets the page-breaking behavior before an element. |
| page-break-inside | : | Sets the page-breaking behavior inside an element. |
| position | : | Places an element in a static, relative, absolute or fixed position. |
| position | : | Places an element in a static, relative, absolute or fixed position. |
| quotes | : | Sets the type of quotation marks. |
| right | : | Sets how far the right edge of an element is to the left/right of the right edge of the parent element. |
| table-layout | : | Sets the algorithm used to display the table cells, rows, and columns. |
| text-align | : | Aligns the text in an element. |
| text-decoration | : | Adds decoration to text. |
| text-indent | : | Indents the first line of text in an element. |
| text-transform | : | Controls the letters in an element. |
| top | : | Sets how far the top edge of an element is above/below the top edge of the parent element. |
| vertical-align | : | Sets the vertical alignment of an element. |
| visibility | : | Sets if an element should be visible or invisible. |
| white-space | : | Sets how white space inside an element is handled. |
| width | : | Sets the width of an element. |
| word-spacing | : | Increase or decrease the space between words. |
| z-index | : | Sets the stack order of an element. |
| :active | : | Adds special style to an activated element. |
| :after | : | Inserts some content after an element. |
| :before | : | Inserts some content before an element. |
| :first-child | : | Adds special style to an element that is the first child of some other element. |
| :first-letter | : | Adds special style to the first letter of a text. |
| :first-line | : | Adds special style to the first line of a text. |
| :focus | : | Adds special style to an element while the element has focus. |
| :hover | : | Adds special style to an element when you mouse over it. |
| :lang | : | Allows the author to specify a language to use in a specified element. |
| :link | : | Adds special style to an unvisited link. |
| :visited | : | Adds special style to a visited link. |
Copyright © 2008 by Dave Sailer
Buznutt ~ A small company with a funny name. Dedicated to making it simple.
Dedicated to communication, collaboration, to developing web sites.
For innovators and creators. For Real. Yay!
