JavaScript Style Attributes

这个可是不可多得的好多西，要做网页特效，就不可能不用到它。^_^

Box Properties Name JavaScript Name Description Possible Values Element Types Example inherited border Sets border width, style and color. See border width, style, and color All {border: medium solid green} No border-bottom Set the bottom border width style, and color. See border width, style, and color All {border-bottom: medium solid green} No border-bottom-width Set the bottom border width thin, medium, thick, or length value All {border-bottom-width: thin} No border-color Set the border color A color value, color, #RRGGBB All {border: #0000ff} No border-left Set the left border width style, and color. See border width, style, and color All {border-left: medium solid green} No border-left-width Set the left border width thin, medium, thick, or length value All {border-left-width: thin} No border-right Set the right border width style, and color. See border width, style, and color All {border-right: medium solid green} No border-right-width Set the right border width thin, medium, thick, or length value All {border-right-width: thin} No border-style Sets border style none, dotted, dashed, solid, double, groove, ridge, inset, outset All {border: dashed} No border-top Set the top border width style, and color. See border width, style, and color All {border-top: medium solid green} No border-top-width Set the top border width thin, medium, thick, or length value All {border-top-width: thin} No border-width Sets Border width. thin, medium, thick, or length value All {border-width: 8} No clear Determines where floating elements are allowed. none, left, right, both All {clear: left} No float Specifies how text is wrapped and where it is aligned. none, left, right All {float: left} No height Height of element auto or a height value Block elements and IMG, INPUT, TEXTAREA, SELECT, and OBJECT {height: 200} No margin Set element margin width. A single value sets all margins, two values set top and bottom, four values set top, right, bottom, and left margins. auto, length value, or percent value All {margin: 4em 2em 4em 2em} No margin-bottom marginBottom Set element bottom margin length value, or percent value All {margin-bottom: 4em} No margin-left marginLeft Set element left margin length value, or percent value All {margin-left: 4em} No margin-right marginRight Set element right margin length value, or percent value All {margin-right: 4em} No margin-top marginTop Set element top margin length value, or percent value All {margin-top: 4em} No padding Space between border and content. A single value sets all sides, two values set top/bottom and left/right, three values set top, right/left, and bottom, and four values set top, right, bottom, and left. length value, or percent value All {padding: 4em} No padding-bottom Space between bottom border and content. length value, or percent value All {padding-bottom: 4em} No padding-left Space between left border and content. length value, or percent value All {padding-left: 4em} No padding-right Space between right border and content. length value, or percent value All {padding-right: 4em} No padding-top Space between top border and content. length value, or percent value All {padding-top: 4em} No width Width of element auto or a height value in length or percentage Block elements and IMG, INPUT, TEXTAREA, SELECT, and OBJECT {width: 40em} No

Background and Color Properties

Name	JavaScript Name	Description	Possible Values	Element Types	Example	inherited
background		Set background color, repeat, image, attachment, or position.	See background-color, background-image, background-attachment, background-repeat, background-position		All	{background: #8080ff}	No
background-attachment		Determines if the background image is fixed or scroll.	scroll, fixed	All	{background-attachment: scroll}	No
background-color	backgroundColor	Sets the background color.	Named or value color	All	{background-color: #8080ff}	No
background-image		Sets the background image.	url	All	{background-image: url('../../../../gifs/flowers.gif')}	No
background-position		Sets the background image initial position.	top, center, bottom, left, center, right, or percent values	Block and IMG, INPUT, TEXTAREA, SELECT, and OBJECT	{background-position: left top}	No
background-repeat		Sets how the background image is repeated.	repeat, repeat-x, repeat-y, no-repeat	All	{background-repeat: no-repeat}	No
color	color	Sets element color.	Named or value color	All	{color: green}	Yes

---

Classification Properties

Name	JavaScript Name	Description	Possible Values	Element Types	Example	inherited
display		Sets the type of element.	block, inline, list-item, none	All	{display: list-item}	No
list-style	listStyle	Sets list style type and/or position.	See list-style-type and list-style-position	List-item	{list-style: circle}	Yes
list-style-image		Sets image to be used as the list item marker.	url	List-item	{list-style-image: url(this.gif)}	Yes
list-style-type		Sets list style type.	circle, disc, decimal, lower-alpha, lower-roman, none, square, upper-alpha, upper-roman	List-item	{list-style-type: square}	Yes
list-style-position		Sets where the marker is place relative to the text and its wrapping position.	inside, outside	List-item	{list-style: circle}	Yes
whitespace		Sets treatment of spaces inside the element.	normal, pre, nowrap	Block	{whitespace: pre}	Yes

---

Font Properties

Name	JavaScript Name	Description	Possible Values	Element Types	Example	inherited
font		Used to define font properties	See font-family, font-size, font-style, font-variant, and font-weight.	All	{font: 20pt}	Yes
font-family	fontFamily	Used to define font family to use	family name	All	{font-family: ariel roman}	Yes
font-size		Used to define font size to use	xx-small, x-small, small, medium, large, x-large, xx-large, larger, smaller, length value, or percent value	All	{font-size: 18pt}	Yes
font-style	fontStyle	Used to define font style to use	normal, italic, oblique	All	{font-style: italic}	Yes
font-variant	fontVariant	Used to determine whether to use normal or small caps	normal, small-caps	All	{font-variant: small-caps}	Yes
font-weight	fontWeight	Sets font weight.	normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900	All	{font-weight: 600}	Yes

---

Text Properties

Name	JavaScript Name	Description	Possible Values	Element Types	Example	inherited
letter-spacing		Sets the space between characters.	normal or length value	All	{letter-spacing: 0.2em}	Yes
line-height	lineHeight	Sets the height of lines.	normal, a number, a percent of the element font size,	All	{line-height: 2}	Yes
text-align	textAlign	Sets the alignment of text.	left, right, center, justify	Block	{text-align: center}	Yes
text-decoration	textDecoration	Sets the special decoration attributes of text.	none, overline, underline, line-through, blink	All	{text-decoration: blink}	No
text-indent	textIndent	Sets the element's first line amount of indentation.	length or percentage value	Block	{text-indent: 5%}	Yes
text-transform	textTransform	Transforms text to one of the set values.	none, capitalize, uppercase, lowercase	All	{text-transform: uppercase}	Yes
vertical-align	verticalAlign	Sets vertical position.	baseline, sub. super, top, middle, bottom, text-top, text-bottom, or percent value	Inline	{vertical-align: sub}	No
word-spacing		Sets extra space between words.	normal or length value	All	{word-spacing: 0.2em}	Yes