DOM Style 对象

Style 对象

The Style object represents an individual style statement. The Style object can be accessed from the document or from the elements to which that style is applied.
Style对象可代表一个单独的style声明。Style对象可被文档或是支持样式的元素所访问到。

Syntax for using the Style object properties:
使用Style对象属性的语法：

document.getElementById("id").style.property="value"

The Style object property categories:
Style对象的属性分类：

Background Border and Margin Layout List Misc

Positioning Printing Scrollbar Table Text

IE: Internet Explorer, M: Mac IE only, W: Windows IE only, F: Firefox, N: Netscape, W3C: World Wide Web Consortium (Internet Standard).

Background properties

Property 属性	Description 描述	Values 值	IE	F	N
background	Sets or returns all background properties in one 设置或返回background属性	backgroundColor backgroundImage backgroundRepeat backgroundAttachment backgroundPosition	4	1	6
backgroundAttachment	Sets or returns whether a background image is fixed or scrolls with the rest of the page 设置或返回背景图片的表现形式	scroll fixed	4	1	6
backgroundColor	Sets or returns the background color of the element 设置或返回背景颜色	color-rgb color-hex color-name transparent	4	1	6
backgroundImage	Sets or returns the background image of the element 设置或返回元素的背景图	url("URL") none	4	1	6
backgroundPosition	Sets or returns the starting position of the background image 设置或返回背景图片的开始位置	top left top center top right center left center center center right bottom left bottom center bottom right x-% y-% x-pos y-pos	4	1	6
backgroundPositionX	Sets or returns the x-coordinates of the backgroundPosition property 设置或返回背景位置的X坐标	left center right x-% x-pos	4
backgroundPositionY	Sets or returns the y-coordinates of the backgroundPosition property 设置或返回背景位置的Y坐标	top center bottom y-% y-pos	4
backgroundRepeat	Sets or returns if/how a background image will be repeated 设置或返回背景是否重复显示，怎样重复显示	repeat repeat-x repeat-y no-repeat	4	1	6

Border and Margin properties

Property 属性	Description 描述	Values 值	IE	F	N
border	Sets or returns all properties for the four borders in one 设置或返回所有四边的属性	borderWidth borderStyle borderColor	4	1	6
borderBottom	Sets or returns all properties for the bottom border in one 设置或返回下边框的所有属性	borderWidth borderStyle borderColor	4	1	6
borderLeft	Sets or returns all property for the left border in one 设置或获取对象左边框的属性。	borderWidth borderStyle borderColor	4	1	6
borderRight	Sets or returns all property for the right border in one 设置或获取对象右边框的属性。	borderWidth borderStyle borderColor	4	1	6
borderTop	Sets or returns all property for the top border in one 设置或获取对象上边框的属性。	borderWidth borderStyle borderColor	4	1	6
borderBottomColor	Sets or returns the color of the bottom border 设置或获取对象下边框的属性。	borderColor	4	1	6
borderLeftColor	Sets or returns the color of the left border 设置或获取对象左边框的颜色。	borderColor	4	1	6
borderRightColor	Sets or returns the color of the right border 设置或获取对象右边框的颜色。	borderColor	4	1	6
borderTopColor	Sets or returns the color of the top border 设置或获取对象上边框的颜色。	borderColor	4	1	6
borderBottomStyle	Sets or returns the style of the bottom border 设置或获取对象下边框的样式。	borderStyle	4	1	6
borderLeftStyle	Sets or returns the style of the left border 设置或获取对象左边框的样式。	borderStyle	4	1	6
borderRightStyle	Sets or returns the style of the right border 设置或获取对象右边框的样式。	borderStyle	4	1	6
borderTopStyle	Sets or returns the style of the top border 设置或获取对象上边框的样式。	borderStyle	4	1	6
borderBottomWidth	Sets or returns the width of the bottom border 设置或获取对象下边框的宽度。	borderWidth	4	1	6
borderLeftWidth	Sets or returns the width of the left border 设置或获取对象左边框的宽度。	borderWidth	4	1	6
borderRightWidth	Sets or returns the width of the right border 设置或获取对象右边框的宽度。	borderWidth	4	1	6
borderTopWidth	Sets or returns the width of the top border 设置或获取对象上边框的宽度。	borderWidth	4	1	6
borderColor	Sets or returns the color of all four borders (can have up to four colors) 设置或获取对象的边框颜色。	color-rgb color-hex color-name	4	1	6
borderStyle	Sets or returns the style of all four borders 设置或获取对象上下左右边框的样式。	none dotted dashed solid double groove ridge inset outset	4	1	6
borderWidth	Sets or returns the width of all four borders 设置或获取对象上下左右边框的宽度。	thin medium thick length	4	1	6
margin	Sets or returns the top, right, bottom, and left margins of the element 设置或获取对象的上下左右边距。	marginTop marginRight marginBottom marginLeft	4	1	6
marginBottom	Sets or returns the bottom margin of the element 设置或获取对象的下边距宽度。	auto length %	4	1	6
marginLeft	Sets or returns the left margin of the element 设置或获取对象的左边距宽度。	auto length %	4	1	6
marginRight	Sets or returns the right margin of the element 设置或获取对象的右边距宽度。	auto length %	4	1	6
marginTop	Sets or returns the top margin of the element 设置或获取对象的上边距宽度。	auto length %	4	1	6
outline	Sets or returns the color, style, and width of the outline around the element 设置或获取围绕元素的颜色，样式和边框宽度	outlineColor outlineStyle outlineWidth	5M	1	6
outlineColor	Sets or returns the color of the outline around the element 设置或返回围绕元素的颜色	color-rgb color-hex color-name invert	5M	1	6
outlineStyle	Sets or returns the style of the outline around the element 设置或返回围绕元素的样式	none dotted dashed solid double groove ridge inset outset	5M	1	6
outlineWidth	Sets or returns the width of the outline around the element 设置或返回围绕元素的边框宽度	thin medium thick length	5M	1	6
padding	Sets or returns the top, right, bottom, and left padding of the element 设置或获取要在对象和其边距或若存在的边框的话就是对象和其边框之间要插入的全部空间。	paddingTop paddingRight paddingBottom paddingLeft	4	1	6
paddingBottom	Sets or returns the bottom padding of the element 设置或获取要在对象下边框和内容之间插入的空间总量。	length %	4	1	6
paddingLeft	Sets or returns the left padding of the element 设置或获取要在对象左边框和内容之间插入的空间总量。	length %	4	1	6
paddingRight	Sets or returns the right padding of the element 设置或获取要在对象右边框和内容之间插入的空间总量。	length %	4	1	6
paddingTop	Sets or returns the top padding of the element 设置或获取对象上边框和内容之间插入的空间总量。	length %	4	1	6

Layout properties

Property 属性	Description 描述	Values 值	IE	F	N
clear	Sets or returns which sides of an element other floating elements are not allowed 设置或获取对象是否允许在其左侧、右侧或两边放置浮动对象，以防下段文本显示在浮动对象上。	left right both none	4	1	6
clip	Sets or returns the shape of an element. What if an image is larger than the element it goes inside? - This property lets you specify the dimensions of an element that should be visible, and the element is clipped into this shape, and displayed 设置或获取定位对象的哪个部分可见。	auto rect(top right bottom left)	4	1	6
clipBottom	Returns the bottom coordinate of the clipping region	auto length	5W	1	6
clipLeft	Returns the left coordinate of the clipping region	auto length	5W	1	6
clipRight	Returns the right coordinate of the clipping region	auto length	5W	1	6
clipTop	Returns the top coordinate of the clipping region	auto length	5W	1	6
content	Sets or returns meta-information 设置或返回meta信息		5M	1	6
counterIncrement			5M	1	6
counterReset			5M	1	6
cssFloat			5M	1	6
cursor	Sets or returns the type of cursor to be displayed when the mouse pointer moves over the element 设置或获取当鼠标指针指向对象时所使用的鼠标指针。	auto crosshair default hand pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait help all-scroll (IE6+) col-resize (IE6+) no-drop (IE6+) not-allowed (IE6+) pointer (IE6+) progress (IE6+) row-resize (IE6+) url(uri) (IE6+) vertical-text (IE6+)	4	1	6
direction	Sets or returns the reading order 设置或获取对象的阅读顺序。	ltr rtl	5	1	6
display	Sets or returns how/if an element is displayed 设置或获取对象是否要渲染。	block none inline inline-block list-item (IE6+) table-header-group table-footer-group	4	1	6
filter	Sets or returns the filter/filters applied to the element 设置或返回元素是否需要应用滤镜		4W
layoutGrid			5W
layoutGridChar			5W
layoutGridLine			5W
layoutGridMode			5W
layoutGridType			5W
markerOffset			5M	1	6
marks			5M	1	6
maxHeight			5M	1	6
maxWidth			5M	1	6
minHeight			6	1	6
minWidth			5M	1	6
MozOpacity				1	6
overflow			4	1	6
overflowX			5W	1	6
overflowY			5W	1	6
styleFloat			4
verticalAlign			4	1	6
visibility			4	1	6
width			4	1	6
zoom			5W

List properties

Property 属性	Description 描述	Values 值	IE	F	N
listStyle	Sets or returns all the properties for a list in one 设置或获取对象最多三个独立的 listStyle 属性。	listStyleType listStylePosition listStyleImage	4	1	6
listStyleImage	Sets or returns the value of the image that is the list-item marker 获取要为对象应用的列表项目符号的图像。	none url(url)	4	1	6
listStylePosition	Sets or returns where the list-item marker is placed in the list 获取相对于对象内容如何绘制项目符号。	outside inside	4	1	6
listStyleType	Sets or returns the type of the list-item marker 获取对象预定义的项目符号类型。	disc circle square decimal lower-roman upper-roman lower-alpha upper-alpha none	4	1	6

Misc properties

Property 属性	Description 描述	Values 值	IE	F	N
accelerator	Sets or returns a Boolean value indicating whether the element contains an accelerator key 设置或获取表明对象是否包含快捷键的字符串。	false true	5W
behavior			5W
cssText			4	1	6
imeMode			5W

Positioning properties

Property	Description	Values	IE	F	N
bottom			5	1	6
height			4	1	6
left			4	1	6
pixelBottom			4
pixelHeight			4
pixelLeft			4
pixelRight			4
pixelTop			4
pixelWidth			4
posBottom			4
posHeight			4
posLeft			4
posRight			4
posTop			4
posWidth			4
position			4	1	6
right			5	1	6
top			4	1	6
width			4	1	6
zIndex			4	1	6

Printing properties

Property	Description	Values	IE	F	N
orphans			5M	1	6
widows			5M	1	6
page			5M	1	6
pageBreakAfter			4	1	6
pageBreakBefore			4	1	6
pageBreakInside			5M	1	6
size				1	6

Scrollbar properties

Property	Description	Values	IE	F	N
scrollbar3dLightColor			5W
scrollbarArrowColor			5W
scrollbarBaseColor			5W
scrollbarDarkShadowColor			5W
scrollbarFaceColor			5W
scrollbarHighlightColor			5W
scrollbarShadowColor			5W
scrollbarTrackColor			5W

Table properties

Property	Description	Values	IE	F	N
borderCollapse			5M	1	6
borderSpacing			5M	1	6
captionSide			5M	1	6
emptyCells			5M	1	6
tableLayout			5	1	6

Text properties

Property	Description	Values	IE	F	N
color			4	1	6
font			4	1	6
fontFamily			4	1	6
fontSize			4	1	6
fontSizeAdjust			5M	1	6
fontStretch			5M	1	6
fontStyle			4	1	6
fontVariant			4	1	6
fontWeight			4	1	6
letterSpacing			4	1	6
lineBreak			5
lineHeight			4	1	6
quotes			5M	1	6
rubyAlign			5
rubyOverhang			5
rubyPosition			5
textAlign			4	1	6
textAlignLast			5
textAutospace			5W
textDecoration			4	1	6
textDecorationBlink			4
textDecorationLineThrough			4
textDecorationLineNone			4
textDecorationLineOverline			4
textDecorationLineUnderline			4
textIndent			4	1	6
textJustify			5
textJustifyTrim			5
textKashidaSpace			5
textOverflow			6W
textShadow			5M	1	6
textTransform			4	1	6
textUnderlinePosition			5
unicodeBidi			5	1	6
whiteSpace			4	1	6
wordBreak			5W
wordSpacing			6	1	6
wordWrap			5W
writingMode			5W