w
ord
-wr
ap
’ and ‘tex
t-o
ver
flo
w
’ properties, which were
introduced unprefixed by Microsoft Internet Explorer prior to the
introduction of the vendor prefixing policy in CSS2.1 and were
subsequently implemented unprefixed by other browsers, creating a
dependency on the unprefixed names despite the lack of a W3C spec. Any
other legacy exceptions should be made in consultation with the CSS
Working Group.
Name | Values | Initial value | Applies to | Inherited? | Percentages | Media |
---|---|---|---|---|---|---|
background-attachment
| scroll | fixed | inherit | scroll | no | visual | ||
background-color
| <color> | inherit | transparent | no | visual | ||
background-image
| <uri> | none | inherit | none | no | visual | ||
background-position
| [ [ <percentage> | <length> | left | center | right ] [ <percentage> | <length> | top | center | bottom ]? ] | [ [ left | center | right ] || [ top | center | bottom ] ] | inherit | 0% 0% | no | refer to the size of the box itself | visual | |
background-repeat
| repeat | repeat-x | repeat-y | no-repeat | inherit | repeat | no | visual | ||
background
| [‘background-color ’ || ‘background-image ’ || ‘background-repeat ’ || ‘background-attachment ’ || background-position ]
| inherit
| see individual properties | no | allowed on ‘background-position ’
| visual | |
border-collapse
| collapse | separate | inherit | separate | ‘table ’ and ‘inline-table ’ elements
| yes | visual | |
border-color
| [ <color> ]{1,4} | inherit | see individual properties | no | visual | ||
border-spacing
| <length> <length>? | inherit | 0 | ‘table ’ and ‘inline-table ’ elements
| yes | visual | |
border-style
| <border-style>{1,4} | inherit | see individual properties | no | visual | ||
border-top
border-right
border-bottom
border-left
| [ <border-width>
|| <border-style>
|| border-top-color
] | inherit
| see individual properties | no | visual | ||
border-top-color
border-right-color
border-bottom-color
border-left-color
| <color> | inherit | the value of the ‘color ’
property
| no | visual | ||
border-top-style
border-right-style
border-bottom-style
border-left-style
| <border-style> | inherit | none | no | visual | ||
border-top-width
border-right-width
border-bottom-width
border-left-width
| <border-width> | inherit | medium | no | visual | ||
border-width
| <border-width>{1,4} | inherit | see individual properties | no | visual | ||
border
| [ <border-width>
|| <border-style>
|| border-top-color
] | inherit
| see individual properties | no | visual | ||
bottom
| <length> | <percentage> | auto | inherit | auto | positioned elements | no | refer to height of containing block | visual |
caption-side
| top | bottom | inherit | top | ‘table-caption ’ elements
| yes | visual | |
clear
| none | left | right | both | inherit | none | block-level elements | no | visual | |
clip
| <shape> | auto | inherit | auto | absolutely positioned elements | no | visual | |
color
| <color> | inherit | depends on user agent | yes | visual | ||
content
| normal | none | [ <string> | <uri> | <counter> | attr(<identifier>) | open-quote | close-quote | no-open-quote | no-close-quote ]+ | inherit | normal | :before and :after pseudo-elements | no | all | |
counter-increment
| [ <identifier> <integer>?]+ | none | inherit | none | no | all | ||
counter-reset
| [ <identifier> <integer>?]+ | none | inherit | none | no | all | ||
cursor
| [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit | auto | yes | visual, interactive | ||
direction
| ltr | rtl | inherit | ltr | all elements, but see prose | yes | visual | |
display
| inline | block | list-item | inline-block | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit | inline | no | all | ||
empty-cells
| show | hide | inherit | show | ‘table-cell ’ elements
| yes | visual | |
float
| left | right | none | inherit | none | all, but see 9.7 | no | visual | |
font-family
| [ [ <family-name> | <generic-family> ] [, <family-name>| <generic-family> ]* ] | inherit | depends on user agent | yes | visual | ||
font-size
| <absolute-size> | <relative-size> | <length> | <percentage> | inherit | medium | yes | refer to inherited font size | visual | |
font-style
| normal | italic | oblique | inherit | normal | yes | visual | ||
font-variant
| normal | small-caps | inherit | normal | yes | visual | ||
font-weight
| normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit | normal | yes | visual | ||
font
| [ [ ‘font-style ’ || ‘font-variant ’ || ‘font-weight ’ ]? ‘font-size ’ [ / ‘line-height ’ ]? font-family
] | caption | icon | menu | message-box | small-caption | status-bar |
inherit
| see individual properties | yes | see individual properties | visual | |
height
| <length> | <percentage> | auto | inherit | auto | all elements but non-replaced inline elements, table columns, and column groups | no | see prose | visual |
left
| <length> | <percentage> | auto | inherit | auto | positioned elements | no | refer to width of containing block | visual |
letter-spacing
| normal | <length> | inherit | normal | yes | visual | ||
line-height
| normal | <number> | <length> | <percentage> | inherit | normal | yes | refer to the font size of the element itself | visual | |
list-style-image
| <uri> | none | inherit | none | elements with ‘display:
list-item ’
| yes | visual | |
list-style-position
| inside | outside | inherit | outside | elements with ‘display:
list-item ’
| yes | visual | |
list-style-type
| disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha | upper-alpha | none | inherit | disc | elements with ‘display:
list-item ’
| yes | visual | |
list-style
| [ ‘list-style-type ’ || ‘list-style-position ’ || list-style-image
] | inherit
| see individual properties | elements with ‘display:
list-item ’
| yes | visual | |
margin-right
margin-left
| <margin-width> | inherit | 0 | all elements except elements with table display types other than table-caption, table and inline-table | no | refer to width of containing block | visual |
margin-top
margin-bottom
| <margin-width> | inherit | 0 | all elements except elements with table display types other than table-caption, table and inline-table | no | refer to width of containing block | visual |
margin
| <margin-width>{1,4} | inherit | see individual properties | all elements except elements with table display types other than table-caption, table and inline-table | no | refer to width of containing block | visual |
max-height
| <length> | <percentage> | none | inherit | none | all elements but non-replaced inline elements, table columns, and column groups | no | see prose | visual |
max-width
| <length> | <percentage> | none | inherit | none | all elements but non-replaced inline elements, table rows, and row groups | no | refer to width of containing block | visual |
min-height
| <length> | <percentage> | inherit | 0 | all elements but non-replaced inline elements, table columns, and column groups | no | see prose | visual |
min-width
| <length> | <percentage> | inherit | 0 | all elements but non-replaced inline elements, table rows, and row groups | no | refer to width of containing block | visual |
opacity
| <number> | inherit | 1 | all | no | visual | |
orphans
| <integer> | inherit | 2 | block container elements | yes | visual, paged | |
outline-color
| <color> | invert | inherit | invert | no | visual, interactive | ||
outline-style
| <border-style> | inherit | none | no | visual, interactive | ||
outline-width
| <border-width> | inherit | medium | no | visual, interactive | ||
outline
| [ ‘outline-color ’ || ‘outline-style ’ || outline-width
] | inherit
| see individual properties | no | visual, interactive | ||
overflow
| visible | hidden | scroll | auto | inherit | visible | block containers | no | visual | |
padding-top
padding-right
padding-bottom
padding-left
| <padding-width> | inherit | 0 | all elements except table-row-group, table-header-group, table-footer-group, table-row, table-column-group and table-column | no | refer to width of containing block | visual |
padding
| <padding-width>{1,4} | inherit | see individual properties | all elements except table-row-group, table-header-group, table-footer-group, table-row, table-column-group and table-column | no | refer to width of containing block | visual |
page-break-after
| auto | always | avoid | left | right | inherit | auto | block-level elements (but see text) | no | visual, paged | |
page-break-before
| auto | always | avoid | left | right | inherit | auto | block-level elements (but see text) | no | visual, paged | |
page-break-inside
| avoid | auto | inherit | auto | block-level elements (but see text) | no | visual, paged | |
position
| static | relative | absolute | fixed | inherit | static | no | visual | ||
quotes
| [<string> <string>]+ | none | inherit | depends on user agent | yes | visual | ||
right
| <length> | <percentage> | auto | inherit | auto | positioned elements | no | refer to width of containing block | visual |
table-layout
| auto | fixed | inherit | auto | ‘table ’ and ‘inline-table ’ elements
| no | visual | |
text-align
| left | right | center | justify | inherit | a nameless value that acts as ‘left ’ if ‘direction ’ is ‘ltr ’, ‘right ’ if ‘direction ’ is ‘rtl ’
| block containers | yes | visual | |
text-decoration
| none | [ underline || overline || line-through || blink ] | inherit | none | no (see prose) | visual | ||
text-indent
| <length> | <percentage> | inherit | 0 | block containers | yes | refer to width of containing block | visual |
text-transform
| capitalize | uppercase | lowercase | none | inherit | none | yes | visual | ||
top
| <length> | <percentage> | auto | inherit | auto | positioned elements | no | refer to height of containing block | visual |
unicode-bidi
| normal | embed | bidi-override | inherit | normal | all elements, but see prose | no | visual | |
vertical-align
| baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> | inherit | baseline | inline-level and ‘table-cell ’ elements
| no | refer to the ‘line-height ’
of the element itself
| visual |
visibility
| visible | hidden | collapse | inherit | visible | yes | visual | ||
white-space
| normal | pre | nowrap | pre-wrap | pre-line | inherit | normal | yes | visual | ||
widows
| <integer> | inherit | 2 | block container elements | yes | visual, paged | |
width
| <length> | <percentage> | auto | inherit | auto | all elements but non-replaced inline elements, table rows, and row groups | no | refer to width of containing block | visual |
word-spacing
| normal | <length> | inherit | normal | yes | visual | ||
z-index
| auto | <integer> | inherit | auto | positioned elements | no | visual |
Pattern | Meaning | Described in section | First defined in level |
---|---|---|---|
* | any element | Universal selector | 2 |
E | an element of type E | Type selector | 1 |
E[foo] | an E element with a "foo" attribute | Attribute selectors | 2 |
E[foo="bar"] | an E element whose "foo" attribute value is exactly equal to "bar" | Attribute selectors | 2 |
E[foo~="bar"] | an E element whose "foo" attribute value is a list of whitespace-separated values, one of which is exactly equal to "bar" | Attribute selectors | 2 |
E[foo^="bar"] | an E element whose "foo" attribute value begins exactly with the string "bar" | Attribute selectors | 3 |
E[foo$="bar"] | an E element whose "foo" attribute value ends exactly with the string "bar" | Attribute selectors | 3 |
E[foo*="bar"] | an E element whose "foo" attribute value contains the substring "bar" | Attribute selectors | 3 |
E[foo|="en"] | an E element whose "foo" attribute has a hyphen-separated list of values beginning (from the left) with "en" | Attribute selectors | 2 |
E:root | an E element, root of the document | Structural pseudo-classes | 3 |
E:nth-child(n) | an E element, the n-th child of its parent | Structural pseudo-classes | 3 |
E:nth-last-child(n) | an E element, the n-th child of its parent, counting from the last one | Structural pseudo-classes | 3 |
E:nth-of-type(n) | an E element, the n-th sibling of its type | Structural pseudo-classes | 3 |
E:nth-last-of-type(n) | an E element, the n-th sibling of its type, counting from the last one | Structural pseudo-classes | 3 |
E:first-child | an E element, first child of its parent | Structural pseudo-classes | 2 |
E:last-child | an E element, last child of its parent | Structural pseudo-classes | 3 |
E:first-of-type | an E element, first sibling of its type | Structural pseudo-classes | 3 |
E:last-of-type | an E element, last sibling of its type | Structural pseudo-classes | 3 |
E:only-child | an E element, only child of its parent | Structural pseudo-classes | 3 |
E:only-of-type | an E element, only sibling of its type | Structural pseudo-classes | 3 |
E:empty | an E element that has no children (including text nodes) | Structural pseudo-classes | 3 |
E:link E:visited | an E element being the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited) | The link pseudo-classes | 1 |
E:active E:hover E:focus | an E element during certain user actions | The user action pseudo-classes | 1 and 2 |
E:target | an E element being the target of the referring URI | The target pseudo-class | 3 |
E:lang(fr) | an element of type E in language "fr" (the document language specifies how language is determined) | The :lang() pseudo-class | 2 |
E:enabled E:disabled | a user interface element E which is enabled or disabled | The UI element states pseudo-classes | 3 |
E:checked | a user interface element E which is checked (for instance a radio-button or checkbox) | The UI element states pseudo-classes | 3 |
E::first-line | the first formatted line of an E element | The ::first-line pseudo-element | 1 |
E::first-letter | the first formatted letter of an E element | The ::first-letter pseudo-element | 1 |
E::before | generated content before an E element | The ::before pseudo-element | 2 |
E::after | generated content after an E element | The ::after pseudo-element | 2 |
E.warning | an E element whose class is "warning" (the document language specifies how class is determined). | Class selectors | 1 |
E#myid | an E element with ID equal to "myid". | ID selectors | 1 |
E:not(s) | an E element that does not match simple selector s | Negation pseudo-class | 3 |
E F | an F element descendant of an E element | Descendant combinator | 1 |
E >F | an F element child of an E element | Child combinator | 2 |
E + F | an F element immediately preceded by an E element | Adjacent sibling combinator | 2 |
E ~ F | an F element preceded by an E element | General sibling combinator | 3 |