HTML DOM Style Object, Learn HTML DOM Style Object

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.

Syntax for using the Style object properties:

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

The Style object property categories:

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	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	left center right x-% x-pos	4
backgroundPositionY	Sets or returns the y-coordinates of the backgroundPosition property	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		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	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	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	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	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	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

<< Back

Most Viewed Services:
HTML Tutorial XHTML Tutorial CSS Tutorial Javascript Tutorial DHTML Tutorial VB Script TCP/IP Tutorial ADO Tutorial MYSQL Tutorial ASP Tutorial AJAX Tutorial CFML Tutorial PHP Tutorial WML Tutorial FLASH Tutorial XML Tutorial RSS Tutorial SQL Tutorial HTML Articles	Javascript Articles PHP Articles SEO Articles Web Design Articles SEO Tips Web Design Tips Articles CSS CSS Tips HTML Tips JAVASCRIPT Tips MYSQL Tips PHP Tips Money Tutorials Web Hosting

Home

Web Directory

Top Directoriers

Webmaster Directories

Contact

Style object

Most Viewed Services: