Book HomeWebmaster in a Nutshell, 3rd EditionSearch this book

9.4. CSS Reference

The remainder of this chapter lists all the properties defined in the World Wide Web Consortium's Recommended Specification for Cascading Style Sheets, Level 1 (http://www.w3.org/pub/WWW/TR/REC-CSS1). All browsers do not implement all properties fully, and some simply do not work correctly. As in the HTML reference, we use the Netscape and Internet Explorer icons to show which browser supports that property. Properties with no icons are not currently supported by these browsers.

The following list includes each property's possible values, defined as either an explicit keyword (shown in constant width) or as one of these values:

color
Either a color name or hexadecimal RGB value, as defined in Chapter 8, or an RGB triple of the form:

rgb(red, green, blue)

where red, green, and blue are either numbers in the range 0 to 255 or percentage values indicating the brightness of that color component. Values of 255 or 100% indicate that the corresponding color component is at its brightest; values of 0 or 0% indicate that the corresponding color component is turned off completely. For example:

rgb(27, 119, 207)
rgb(50%, 75%, 0%)

are both valid color specifications.

length
An optional sign (either + or -), immediately followed by a number (with or without a decimal point) immediately followed by a two-character unit identifier. For values of zero, the unit identifier may be omitted. The unit identifiers em and ex refer to the overall height of the font and to the height of the letter "x", respectively. The unit identifier px is equal to a single pixel on the display device. The unit identifiers in, cm, mm, pt, and pc refer to inches, centimeters, millimeters, points, and picas, respectively. There are 72.27 points per inch and 12 points in a pica.

number
An optional sign, immediately followed by a number (with or without a decimal point).

percent
An optional sign, immediately followed by a number (with or without a decimal point), immediately followed by a percent sign. The actual value is computed as a percentage of some other element property, usually the element's size.

url
The keyword url, immediately followed (no spaces) by a left parenthesis, followed by a URL optionally enclosed in single or double quotes, followed by a matching right parenthesis. This is a valid URL, for example:

url("http://members.aol.com/htmlguru")

Finally, some values are lists of other values and are described as a "list of" some other value. In these cases, a list consists of one or more of the allowed values, separated by commas. The standard defines a default value for most properties. The default property is listed in the top syntax line for the property. Additional allowed values are listed beneath each description.

background

background:list

Composite property for the background-attachment, background-color, background-image, background-position, and background-repeat properties; list is any of these properties' values, in any order.

background-attachment

background-attachment: scroll

Determines if the background image is fixed in the window or scrolls as the document scrolls. Accepted values: fixed, scroll

background-color

background-color: transparent

Sets the background color of an element. Accepted values: color, transparent.

background-image

background-image: none

Sets the background image of an element. Accepted values: url, transparent.

background-position

background-position: percent

Sets the initial position of the element's background image, if specified; values are normally paired to provide x, y positions. Default position is 0% 0%. Accepted values: length, percent, top, center, bottom, left, right.

background-repeat

background-repeat: repeat

Determines how the background image is repeated (tiled) across an element. Accepted values: repeat, repeat-x, repeat-y, no-repeat.

border

border: list

Sets all four borders on an element; value is one or more of a color, a value for border-width, and a value for border-style.

border-bottom

border-bottom: list

Sets the bottom border on an element; value is one or more of a color, a value for border-bottom-width, and a value for border-style.

border-bottom-width

border-bottom-width: medium

Sets the thickness of an element's bottom border. Accepted values: medium, length, thin, thick.

border-color

border-color: color

Sets the color of all four of an element's borders; default is the color of the element.

border-left

border-left: list

Sets the left border on an element; value is one or more of a color, a value for border-left-width, and a value for border-style.

border-left-width

border-left-width: medium

Sets the thickness of an element's left border. Accepted values: length, medium, thin, thick.

border-right

border-right: list

Sets the right border on an element; value is one or more of a color, a value for border-right-width, and a value for border-style.

border-right-width

border-right-width: medium

Sets the thickness of an element's right border. Accepted values: length, medium, thin, thick.

border-style

border-style: none

Sets the style of all four of an element's borders. Accepted values: none, dashed, dotted, double, groove, inset, outset, ridge, solid.

border-top

border-top: list

Sets the top border on an element; value is one or more of a color, a value for border-top-width, and a value for border-style.

border-top-width

border-top-width: medium

Sets the thickness of an element's top border. Accepted values: length, medium, thin, thick.

border-width

border-width: medium

Sets the thickness of all four of an element's borders. Accepted values: length, medium, thin, thick.

clear

clear: none

Sets which margins of an element must not be adjacent to a floating element; the element will be moved down until that margin is clear. Accepted values: none, both, left, right.

color

color: color

Sets the color of an element.

display

display: block

Controls how an element is displayed. Accepted values: block, inline, list-item, none.

float

float: none

Determines if an element floats to the left or right, allowing text to wrap around it, or be displayed inline (using none). Accepted values: left, right, none.

font

font: list

Sets all the font attributes for an element; value is any of the values for font-style, font-variant, font-weight, font-size, line-height, and font-family, in that order.

font-family

font-family: list of font names

Defines the font for an element, either as a specific font or as one of the generic fonts serif, sans-serif, cursive, fantasy, or monospace.

font-size

font-size: size

Defines the font size. Accepted values: length, percent, xx-small, x-small, small, medium, large, x-large, xx-large, larger, smaller.

font-style

font-style: normal

Defines the style of the face, either normal or some type of slanted style. Accepted values: italic, oblique, normal.

font-variant

font-variant: normal

Defines a font to be in small caps. Accepted values: smallcaps, normal.

font-weight

font-weight: normal

Defines the font weight. If a number is used, it must be a multiple of 100 between 100 and 900; 400 is normal, 700 is the same as the keyword bold. Accepted values: bold, bolder, lighter, number, normal.

height

height: auto

Defines the height of an element. Accepted values: length, auto.

letter-spacing

letter-spacing: normal

Inserts additional space between text characters. Accepted values: length, normal.

line-height

line-height: normal

Sets the distance between adjacent text baselines. Accepted values: length, number, percent, normal.

list-style

list-style: list

Defines list-related styles using any of the values for list-style-image, list-style-position, and list-style-type.

list-style-image

list-style-image: none

Defines an image to be used as a list item's marker, in lieu of the value for list-style-type. Accepted values: url, none.

list-style-position

list-style-position: outside

Indents or extends (default) a list item's marker with respect to the item's content. Accepted values: inside, outside.

list-style-type

list-style-type: disc

Defines a list item's marker for either unordered lists (circle, disc, or square) or ordered lists (the rest). Accepted values: circle, square, decimal, disc, lower-alpha, lower-roman, none, upper-alpha, upper-roman.

margin

margin: length

Defines all four of an element's margins. Accepted values: length, percent, auto.

margin-bottom

margin-bottom: length

Defines the bottom margin of an element; default value is 0. Accepted values: length, percent, auto.

margin-left

margin-left: length

Defines the left margin of an element; default value is 0. Accepted values: length, percent, auto.

margin-right

margin-right: length

Defines the right margin of an element; default value is 0. Accepted values: length, percent, auto.

margin-top

margin-top: length

Defines the top margin of an element; default value is 0. Accepted values: length, percent, auto.

padding

padding:list

Defines all four padding amounts around an element.

padding-bottom

padding-bottom: length

Defines the bottom padding of an element; default value is 0. Accepted values: length, percent.

padding-left

padding-left: length

Defines the left padding of an element; default value is 0. Accepted values: length, percent.

padding-right

padding-right: length

Defines the right padding of an element; default value is 0. Accepted values: length, percent.

padding-top

padding-top: length

Defines the top padding of an element; default value is 0. Accepted values: length, percent.

text-align

text-align: style

Sets the text alignment style for an element. The default value is dependent on the element. Accepted values: center, justify, left, right.

text-decoration

text-decoration: none

Defines any decoration for the text; values may be combined.Accepted values: blink, line-through, none, overline, underline.

text-indent

text-indent: length

Defines the indentation of the first line of text in an element; default value is 0. Accepted values: length, percent.

text-transform

text-transform: none

Transforms the text in the element accordingly. Accepted values: capitalize, lowercase, none, uppercase.

vertical-align

vertical-align: position

Sets the vertical positioning of an element. The default setting is dependent on the element. Accepted values: percent, baseline, bottom, middle, sub, super, text-bottom, text-top, top.

word-spacing

word-spacing: normal

Inserts additional space between words. Accepted values: length, normal.

white-space

white-space: normal

Defines how whitespace within an element is handled. Accepted values: normal, nowrap, pre.

width

width: auto

Defines the width of an element. Accepted values: length, percent, auto.



Library Navigation Links

Copyright © 2003 O'Reilly & Associates. All rights reserved.