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"

Background Properties

Property	Description
background	Sets all background properties in one
backgroundAttachment	Sets whether a background-image is fixed or scrolls with the page
backgroundColor	Sets the background-color of an element
backgroundImage	Sets the background-image of an element
backgroundPosition	Sets the starting position of a background-image
backgroundPositionX	Sets the x-coordinates of the backgroundPosition property
backgroundPositionY	Sets the y-coordinates of the backgroundPosition property
backgroundRepeat	Sets if/how a background-image will be repeated

Border and Margin Properties

Property	Description
border	Sets all properties for the four borders in one
borderBottom	Sets all properties for the bottom border in one
borderBottomColor	Sets the color of the bottom border
borderBottomStyle	Sets the style of the bottom border
borderBottomWidth	Sets the width of the bottom border
borderColor	Sets the color of all four borders (can have up to four colors)
borderLeft	Sets all properties for the left border in one
borderLeftColor	Sets the color of the left border
borderLeftStyle	Sets the style of the left border
borderLeftWidth	Sets the width of the left border
borderRight	Sets all properties for the right border in one
borderRightColor	Sets the color of the right border
borderRightStyle	Sets the style of the right border
borderRightWidth	Sets the width of the right border
borderStyle	Sets the style of all four borders (can have up to four styles)
borderTop	Sets all properties for the top border in one
borderTopColor	Sets the color of the top border
borderTopStyle	Sets the style of the top border
borderTopWidth	Sets the width of the top border
borderWidth	Sets the width of all four borders (can have up to four widths)
margin	Sets the margins of an element (can have up to four values)
marginBottom	Sets the bottom margin of an element
marginLeft	Sets the left margin of an element
marginRight	Sets the right margin of an element
marginTop	Sets the top margin of an element
outline	Sets all outline properties in one
outlineColor	Sets the color of the outline around a element
outlineStyle	Sets the style of the outline around an element
outlineWidth	Sets the width of the outline around an element
padding	Sets the padding of an element (can have up to four values)
paddingBottom	Sets the bottom padding of an element
paddingLeft	Sets the left padding of an element
paddingRight	Sets the right padding of an element
paddingTop	Sets the top padding of an element

Layout Properties

Property	Description
clear	Sets on which sides of an element other floating elements are not allowed
clip	Sets the shape of an element
content	Sets meta-information
counterIncrement	Sets a list of counter names, followed by an integer. The integer indicates by how much the counter is incremented for every occurrence of the element. The default is 1
counterReset	Sets a list of counter names, followed by an integer. The integer gives the value that the counter is set to on each occurrence of the element. The default is 0
cssFloat	Sets where an image or a text will appear (float) in another element
cursor	Sets the type of cursor to be displayed
direction	Sets the text direction of an element
display	Sets how an element will be displayed
height	Sets the height of an element
markerOffset	Sets the distance between the nearest border edges of a marker box and its principal box
marks	Sets whether cross marks or crop marks should be rendered just outside the page box edge
maxHeight	Sets the maximum height of an element
maxWidth	Sets the maximum width of an element
minHeight	Sets the minimum height of an element
minWidth	Sets the minimum width of an element
overflow	Specifies what to do with content that does not fit in an element box
verticalAlign	Sets the vertical alignment of content in an element
visibility	Sets whether or not an element should be visible
width	Sets the width of an element

List Properties

Property	Description
listStyle	Sets all the properties for a list in one
listStyleImage	Sets an image as the list-item marker
listStylePosition	Positions the list-item marker
listStyleType	Sets the list-item marker type

Misc Properties

Property	Description
cssText

Positioning Properties

Property	Description
bottom	Sets how far the bottom edge of an element is above/below the bottom edge of the parent element
left	Sets how far the left edge of an element is to the right/left of the left edge of the parent element
position	Places an element in a static, relative, absolute or fixed position
right	Sets how far the right edge of an element is to the left/right of the right edge of the parent element
top	Sets how far the top edge of an element is above/below the top edge of the parent element
zIndex	Sets the stack order of an element

Printing Properties

Property	Description
orphans	Sets the minimum number of lines for a paragraph that must be left at the bottom of a page
page	Sets a page type to use when displaying an element
pageBreakAfter	Sets the page-breaking behavior after an element
pageBreakBefore	Sets the page-breaking behavior before an element
pageBreakInside	Sets the page-breaking behavior inside an element
size	Sets the orientation and size of a page
widows	Sets the minimum number of lines for a paragraph that must be left at the top of a page

Table Properties

Property	Description
borderCollapse	Sets whether the table border are collapsed into a single border or detached as in standard HTML
borderSpacing	Sets the distance that separates cell borders
captionSide	Sets the position of the table caption
emptyCells	Sets whether or not to show empty cells in a table
tableLayout	Sets the algorithm used to display the table cells, rows, and columns

Text Properties

Property	Description
color	Sets the color of the text
font	Sets all font properties in one
fontFamily	Sets the font of an element
fontSize	Sets the font-size of an element
fontSizeAdjust	Sets/adjusts the size of a text
fontStretch	Sets how to condense or stretch a font
fontStyle	Sets the font-style of an element
fontVariant	Displays text in a small-caps font
fontWeight	Sets the boldness of the font
letterSpacing	Sets the space between characters
lineHeight	Sets the distance between lines
quotes	Sets which quotation marks to use in a text
textAlign	Aligns the text
textDecoration	Sets the decoration of a text
textIndent	Indents the first line of text
textShadow	Sets the shadow effect of a text
textTransform	Sets capitalization effect on a text
unicodeBidi
whiteSpace	Sets how to handle line-breaks and white-space in a text
wordSpacing	Sets the space between words in a text

Standard Properties and Methods

This object also supports the standard properties and methods.

Standard Events

This object also supports the standard events.