HTML DOM Style Object
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:
W3C: W3C Standard.
| Property |
Description |
W3C |
| clear |
Sets on which sides of an element other floating elements are not allowed |
Yes |
| clip |
Sets the shape of an element |
Yes |
| content |
Sets meta-information |
Yes |
| 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 |
Yes |
| 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 |
Yes |
| cssFloat |
Sets where an image or a text will appear (float) in another element |
Yes |
| cursor |
Sets the type of cursor to be displayed |
Yes |
| direction |
Sets the text direction of an element |
Yes |
| display |
Sets how an element will be displayed |
Yes |
| height |
Sets the height of an element |
Yes |
| markerOffset |
Sets the distance between the nearest border edges of a marker box and its principal box |
Yes |
| marks |
Sets whether cross marks or crop marks should be rendered just outside the page box edge |
Yes |
| maxHeight |
Sets the maximum height of an element |
Yes |
| maxWidth |
Sets the maximum width of an element |
Yes |
| minHeight |
Sets the minimum height of an element |
Yes |
| minWidth |
Sets the minimum width of an element |
Yes |
| overflow |
Specifies what to do with content that does not fit in an element box |
Yes |
| verticalAlign |
Sets the vertical alignment of content in an element |
Yes |
| visibility |
Sets whether or not an element should be visible |
Yes |
| width |
Sets the width of an element |
Yes |
| Property |
Description |
W3C |
| cssText |
|
|
| Property |
Description |
W3C |
| bottom |
Sets how far the bottom edge of an element is above/below the bottom edge of the parent element |
Yes |
| left |
Sets how far the left edge of an element is to the right/left of the left edge of the parent element |
Yes |
| position |
Places an element in a static, relative, absolute or fixed position |
Yes |
| right |
Sets how far the right edge of an element is to the left/right of the right edge of the parent element |
Yes |
| top |
Sets how far the top edge of an element is above/below the top edge of the parent element |
Yes |
| zIndex |
Sets the stack order of an element |
Yes |
| Property |
Description |
W3C |
| orphans |
Sets the minimum number of lines for a paragraph that must be left at the bottom of a page |
Yes |
| page |
Sets a page type to use when displaying an element |
Yes |
| pageBreakAfter |
Sets the page-breaking behavior after an element |
Yes |
| pageBreakBefore |
Sets the page-breaking behavior before an element |
Yes |
| pageBreakInside |
Sets the page-breaking behavior inside an element |
Yes |
| size |
Sets the orientation and size of a page |
Yes |
| widows |
Sets the minimum number of lines for a paragraph that must be left at the
top of a page |
Yes |
| Property |
Description |
W3C |
| borderCollapse |
Sets whether the table border are collapsed into a single
border or detached as in standard HTML |
Yes |
| borderSpacing |
Sets the distance that separates cell borders |
Yes |
| captionSide |
Sets the position of the table caption |
Yes |
| emptyCells |
Sets whether or not to show empty cells in a table |
Yes |
| tableLayout |
Sets the algorithm used to display the table cells, rows,
and columns |
Yes |
| Property |
Description |
W3C |
| color |
Sets the color of the text |
Yes |
| font |
Sets all font properties in one |
Yes |
| fontFamily |
Sets the font of an element |
Yes |
| fontSize |
Sets the font-size of an element |
Yes |
| fontSizeAdjust |
Sets/adjusts the size of a text |
Yes |
| fontStretch |
Sets how to condense or stretch a font |
Yes |
| fontStyle |
Sets the font-style of an element |
Yes |
| fontVariant |
Displays text in a small-caps font |
Yes |
| fontWeight |
Sets the boldness of the font |
Yes |
| letterSpacing |
Sets the space between characters |
Yes |
| lineHeight |
Sets the distance between lines |
Yes |
| quotes |
Sets which quotation marks to use in a text |
Yes |
| textAlign |
Aligns the text |
Yes |
| textDecoration |
Sets the decoration of a text |
Yes |
| textIndent |
Indents the first line of text |
Yes |
| textShadow |
Sets the shadow effect of a text |
Yes |
| textTransform |
Sets capitalization effect on a text |
Yes |
| unicodeBidi |
|
Yes |
| whiteSpace |
Sets how to handle line-breaks and white-space in a text |
Yes |
| wordSpacing |
Sets the space between words in a text |
Yes |
Start Creating a stunning, Flash website. It's easy and free!
Wix.com offers you a simple, powerful, drag & drop editing platform to create stunning Flash websites, layouts, and more.
With added e-commerce features such as search engine visibility and professional tools, Wix is the ultimate solution for creating a spectacular site.
 |
W3Schools' Online Certification Program
The perfect solution for professionals who need to balance work, family, and career building.
More than 4500 certificates already issued!
|
The HTML Certificate documents your knowledge of HTML, XHTML, and CSS.
The JavaScript Certificate documents your knowledge of JavaScript and HTML DOM.
The XML Certificate documents your knowledge of XML, XML DOM and XSLT.
The ASP Certificate documents your knowledge of ASP, SQL, and ADO.
The PHP Certificate documents your knowledge of PHP and SQL (MySQL).
| 
