w3pop.com :: ÍøÂçѧԺ :: HTML DOM :: DOM 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¶ÔÏóµÄÊôÐÔ·ÖÀࣺ
IE: Internet Explorer, M: Mac IE only, W: Windows IE only, F: Firefox, N: Netscape, W3C: World Wide Web Consortium (Internet Standard).
| 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 |
| 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 |
| 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 |
| 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 |
| 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 |
| 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 |
| 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 |
| Property ÊôÐÔ |
Description ÃèÊö |
Values Öµ |
IE | F | N |
|---|---|---|---|---|---|
| scrollbar3dLightColor | 5W | ||||
| scrollbarArrowColor | 5W | ||||
| scrollbarBaseColor | 5W | ||||
| scrollbarDarkShadowColor | 5W | ||||
| scrollbarFaceColor | 5W | ||||
| scrollbarHighlightColor | 5W | ||||
| scrollbarShadowColor | 5W | ||||
| scrollbarTrackColor | 5W |
| 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 |
| 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 |
ÆÀÂÛ (0)
All