CSS Reference

TABLE B.1 CSS Properties and Values
Property/Values	Description and Notes
background any combination of the values for background-attachment, background-color,background-image, background-repeat, and/or background-position, or inherit	For changing the background color and image of elements. initial value depends on individual properties; not inherited; percentages allowed for background-position To display multiple background images, separate the combined background values with a comma; if you are specifying abackground-color, this should be included as a part of the last background.
background-attachment either scroll, fixed, or inherit	For determining if and how background images should scroll. initial value: scroll; not inherited If you are displaying multiple background images, you can apply a separate background-attachment value to each by separating the values with commas.
background-color either a color, transparent, or inherit	For setting just the background color of an element. initial value: transparent; not inherited
background-image either a URL, a CSS gradient (see Table B.4),none, or inherit	For setting just the background image of an element. initial value: none; not inherited To display multiple background images, separate the image values with a comma.
background-position either one or two percentages or lengths (or one percentage and one length) or one of top,center, or bottom and/or one of left, center, or right, or use inherit	For setting the physical position of a specified background image. initial value: 0% 0%; if a single percentage is set, it is used for the horizontal position, and the initial value of the vertical is set to 50%; if only one keyword is used, the initial value of the other is center; applies to block-level and replaced elements; not inherited; percentages refer to the size of the box itself If you are displaying multiple background images, you can apply a separate background-position value to each by separating the values with commas.
background-repeat one of repeat, repeat-x, repeat-y, no-repeat, or inherit	For determining how and if background images should be tiled. initial value: repeat; not inherited If you are displaying multiple background images, you can apply a separate background-repeat value to each by separating the values with commas.
background-size either one or two percentages or lengths, orauto, or use cover or contain	For specifying the size of background images. initial value: auto; not inherited If you are displaying multiple background images, you can apply a separate background-size value to each by separating the values with commas.
border any combination of the values of border-width, border-style, and/or a color, or inherit	For defining all aspects of a border on all sides of an element. initial value depends on individual properties; not inherited
border-color from one to four colors, transparent, orinherit	For setting only the color of the border on one or more sides of an element. initial value: the element's color property; not inherited
border-radius	For giving a box rounded corners. initial value: 0; not inherited
border-top-right-radius, border-bottom-right-radius, border-bottom-left-radius,border-top-left-radius	For setting the border-radius values for only one corner of the box. initial value: 0; not inherited Note: older versions of Firefox use a different syntax for individual corners: -moz-border-radius-topright, -moz-border-radius-bottomright, -moz-border-radius-bottomleft, and -moz-border-radius-topleft.
border-spacing either one or two lengths or inherit	For specifying the amount of space between borders in a table. initial value: 0; may be applied only to table elements; inherited
border-style one to four of the following values: none,dotted, dashed, solid, double, groove,ridge, inset, outset, inherit	For setting only the style of a border on one or more sides of an element. initial value: none; not inherited
border-top, border-right, border-bottom,border-left any combination of a single value each forborder-width, border-style, and/or a color, or use inherit	For defining all three border properties at once on only one side of an element. initial value depends on individual values; not inherited
border-top-color, border-right-color,border-bottom-color, border-left-color one color or inherit	For defining just the border's color on only one side of an element. initial value: the value of the color property; not inherited
border-top-style, border-right-style, border-bottom-style, border-left-style one of none, dotted, dashed, solid, double,groove, ridge, inset, outset, or inherit	For defining just the border's style on only one side of an element. initial value: none; not inherited
border-top-width, border-right-width,border-bottom-width, border-left-width one of thin, medium, thick, or a length	For defining just the border's width on only one side of an element. initial value: medium; not inherited
border-width one to four of the following values: thin,medium, thick, or a length	For defining the border's width on one or more sides of an element. initial value: medium; not inherited
bottom either a percentage, length, auto, or inherit	For setting the distance that an element should be offset from its parent element's bottom edge. initial value: auto; not inherited; percentages refer to height of containing block
box-shadow optional inset followed by two to four length values, followed by a color	For adding one or more drop shadows to a box. The length values refer (in order) to: position to the right of the box (negative values position to the left), position down from the box (negative values position up), blur radius (negative values are not allowed), and spread distance (negative values cause the shadow to contract). Each subsequent box-shadow value should be separated from its predecessor with a comma. initial value: none; inherited
clear one of none, left, right, both, or inherit	For preventing elements from wrapping around on one or both sides of floated elements. initial value: none; may only be applied to block-level elements; not inherited
clip one of auto, rect, or inherit	For displaying only a portion of an element. initial value: auto; applies only to absolutely positioned elements
color a color or inherit	For setting the text color of an element. initial value: parent's color, some colors are set by browser; inherited
cursor one of auto, crosshair, default, pointer,progress, move, e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize, text, wait, help, a URL, orinherit	For setting the cursor's shape. initial value: auto; inherited
display one of inline, block, inline-block, list-item,run-in, compact, table, inline-table, table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, table-caption, ruby, ruby-base, ruby-text, ruby-base-group, ruby-text-group, none, inherit	For determining how and if an element should be displayed. initial value: usually inline or block; not inherited
float one of left, right, none, inherit	For determining which side of the parent element an element will float to. initial value: none; may not be applied to positioned elements or generated content; not inherited
font if desired, any combination of the values forfont-style, font-variant, and font-weightfollowed by the required font-size, an optional value for line-height, and the also-requiredfont-family, or use inherit	For setting at least the font family and size, and optionally the style, variant, weight, and line height of text. initial value depends on individual properties; inherited; percentages allowed for values of font-size and line-height; font-size and font-family are required for the font property to work
font-family one or more quotation mark-enclosed font names followed by an optional generic font name, or use inherit	For choosing the font family for text. initial value: depends on browser; inherited
font-size an absolute size, a relative size, a length, a percentage, or inherit	For setting the size of text. initial value: medium; the computed value is inherited; percentages refer to parent element's font size
font-style either normal, italic, oblique, or inherit	For making text italic. initial value: normal; inherited
font-variant either normal, small-caps, or inherit	For setting text in small caps. initial value: normal; inherited
font-weight either normal, bold, bolder, lighter, 100,200, 300, 400, 500, 600, 700, 800, 900, orinherit	For applying, removing, and adjusting bold formatting. initial value: normal; the numeric values are considered keywords and not integers (you can't choose 150, for example); inherited
height either a length, a percentage, auto, or inherit	For setting the height of an element. initial value: auto; may be applied to all elements except non-replaced inline elements, table columns, and column groups; not inherited
left either a length, a percentage, auto, or inherit	For setting the distance that an element should be offset from its parent element's left edge. initial value: auto; may only be applied to positioned elements; not inherited; percentages refer to width of containing block
letter-spacing either normal, a length, or inherit	For setting the amount of space between letters. initial value: normal; inherited
line-height either normal, a number, a length, a percentage, or inherit	For setting the amount of space between lines of text. initial value: normal; inherited; percentages refer to the font size of the element itself
list-style any combination of the values for list-style-type, list-style-position, and/or list-style-image, or use inherit	For setting a list's marker (regular or custom) and its position. initial value depends on initial values of individual elements; may only be applied to list elements; inherited
list-style-image either a URL, none, or inherit	For designating a custom marker for a list. initial value: none; may only be applied to list elements; overrideslist-style-type; inherited
list-style-position either inside, outside, or inherit	For determining the position of a list's marker. initial value: outside; may only be applied to list elements; inherited
list-style-type either disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha, none, or inherit	For setting a list's marker. initial value: disc; may only be applied to list elements; not used iflist-style-type is valid; inherited
margin one to four of the following: length,percentage, or auto, or inherit	For setting the amount of space between one or more sides of an element's border and its parent and/or sibling elements. initial value depends on browser and on value of width; not inherited; percentages refer to width of containing block
margin-top, margin-right, margin-bottom,margin-left either a length, a percentage, auto, or inherit	For setting the amount of space between only one side of an element's border and its parent and/or sibling elements. initial value: 0; not inherited; percentages refer to width of containing block; the values for margin-right and margin-left may be overridden if sum of width, margin-right, and margin-left are larger than parent element's containing block
max-height, max-width either a length, a percentage, none, or inherit	For setting the maximum height and/or width of an element, respectively. initial value: none; may not be applied to inline elements or table elements; not inherited; percentages refer to height/width of containing block
min-height, min-width either a length, a percentage, or inherit	For setting the minimum height and/or width of an element, respectively. initial value: 0; may not be applied to inline elements or table elements; not inherited; percentages refer to height/width of containing block
opacity any decimal value from 0.0 (fully transparent) to 1.0 (fully opaque)	For making an element translucent or invisible. initial value: 1; not inherited
orphans either an integer or inherit	For specifying how many lines of an element may appear alone at the bottom of a page. initial value: 2; may only be applied to block-level elements; inherited; only for use with print media
overflow either visible, hidden, scroll, auto, or inherit	For determining where extra content should go if it does not fit in the element's content area. initial value: visible; may only be applied to block-level and replaced elements; not inherited
padding one to four lengths or percentages, or inherit	For specifying the distance between one or more sides of an element's content area and its border. initial value depends on browser; not inherited; percentages refer to width of containing block
padding-top, padding-right, padding-bottom, padding-left either a length, a percentage, or inherit	For specifying the distance between one side of an element's content area and its border. initial value: 0; not inherited; percentages refer to width of containing block
page-break-after, page-break-before either always, avoid, auto, right, left, orinherit	For specifying when page breaks should or should not occur. initial value: auto; may only be applied to block-level elements; not inherited; only for use with print media
page-break-inside either avoid, auto, or inherit	For keeping page breaks from dividing an element across pages. initial value: auto; may only be applied to block-level elements; inherited; only for use with print media
position either static, relative, absolute, fixed, orinherit	For determining how an element should be positioned with respect to the document's flow. initial value: static; not inherited
right either a length, a percentage, auto, or inherit	For setting the distance that an element should be offset from its parent element's right edge. initial value: auto; may only be applied to positioned elements; not inherited; percentages refer to width of containing block
table-layout one of fixed, auto, or inherit	For choosing the algorithm that should be used to determine the widths of cells. initial value: auto; not inherited
text-align one of left, right, center, justify, a string, orinherit	For aligning text. initial value depends on browser and writing direction; may only be applied to block-level elements; inherited
text-decoration any combination of underline, overline, line-through, and blink, or none or inherit	For decorating text (mostly with lines). initial value: none; not inherited
text-indent either a length, a percentage, or inherit	For setting the amount of space the first line of a paragraph should be indented. initial value: 0; may only be applied to block-level elements; inherited; percentages refer to width of containing block
text-overflow one of clip, ellipsis, or "string"	For specifying how text overflow must be handled when it is not visible. initial value: clip
text-shadow two to four length values, followed by a color	For adding one or more drop shadows to the text of an element. The length values refer (in order) to: position to the right of the text (negative values position to the left), position down from the box (negative values position up), blur radius (negative values are not allowed), and spread distance (negative values cause the shadow to contract). Each subsequent text-shadow value should be separated from its predecessor with a comma. initial value: none; inherited
text-transform either capitalize, uppercase, lowercase,none, or inherit	For setting the capitalization of an element's text. initial value: none; inherited
transform none or a list of transform functions (matrix,translate, translateX, translateY, scale,scaleX, scaleY, rotate, skew, skewX,skewY)	For transforming the shape, size, or orientation of an element. initial value: none; not inherited; transform functions are applied in the same order they are listed
transform-origin either one or two percentages or lengths (or one percentage and one length) or one of top,center, or bottom and/or one of left, center, or right	For defining the origin of any transforms applied to an element. initial value: 50% 50%; not inherited; only applies to block-level and inline-level elements; percentages refer to the size of the element's box
transition a space-separated shorthand for defining (in order) transition-property, transition-duration, transition-timing-function, andtransition-delay	For defining a transition effect on an element. initial value depends on the individual property; applies to all elements, including the :before and :after pseudo-elements; the order of the values is important to this property
transition-property none, all, or a comma-separated list of CSS properties	For identifying the CSS properties defined on an element that should have a transition applied to it. initial value: all; not inherited; applies to all elements, including the:before and :after pseudo-elements
transition-duration a time value in seconds or milliseconds	For defining the time that a transition takes to complete. initial value: 0s (zero seconds); not inherited; applies to all elements including the :before and :after pseudo-elements
transition-timing-function ease, linear, ease-in, ease-out, ease-in-out, cubic-bezier(number, number,number, number)	For describing how the intermediate values used during a transition are to be calculated. initial value: ease; applies to all elements, including the :beforeand :after pseudo-elements
transition-delay a time value in seconds or milliseconds	For defining when a transition will start. initial value: 0s (zero seconds); not inherited; applies to all elements, including the :before and :after pseudo-elements
top either a length, a percentage, auto, or inherit	For setting the distance that an element should be offset from its parent element's top edge. initial value: auto; may only be applied to positioned elements; not inherited; percentages refer to height of containing block
vertical-align either baseline, sub, super, top, text-top,middle, bottom, text-bottom, a percentage, a length, or inherit	For aligning elements vertically. initial value: baseline; may only be applied to inline-level and table cell elements; not inherited; percentages refer to the element'sline-height property
visibility either visible, hidden, collapse, or inherit	For hiding elements without taking them out of the document's flow. initial value: inherit, which rather makes the fact that it's not inherited a moot point
white-space either normal, pre, nowrap, pre-wrap, pre-lined, or inherit	For specifying how white space should be treated. initial value: normal; may only be applied to block-level elements; inherited
widows either an integer or inherit	For specifying how many lines of an element may appear alone at the top of a page. initial value: 2; may only be applied to block-level elements; inherited; only for use with print media
width either a length, a percentage, auto, or inherit	For setting the width of an element. initial value: auto; may not be applied to inline elements, table rows, or row groups; not inherited; percentages refer to width of containing block
word-spacing either normal, a length, or inherit	For setting the distance between words. initial value: normal; inherited
z-index either auto, an integer, or inherit	For setting the depth of an element with respect to overlapping elements. initial value: auto; may only be applied to positioned elements; not inherited

Table B.1 is derived from the complete specifications at www.w3.org/TR/CSS21/propidx.html and is copyright © World Wide Web Consortium (Massachusetts Institute of Technology, Institut National de Recherche en Informatique et en Automatique, Keio University). All Rights Reserved.