## Example

`

    1

`

## Description

## Properties

Property Name | Description
--- | ---
background | 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.background sets all background properties in one.It can be color,position etc.
backgroundAttachment | Definition:The background property sets all background properties in one declaration. Syntex :Object.style.background=background-color background-image background-repeat background-attachment background-position. background-attachment--Sets if a background-image should be fixed or should scroll with the page.
backgroundColor | The backgroundColor property sets the background color of an element. Syntax Object.style.backgroundColor=color-name|color-rgb |color-hex|transparent
backgroundImage | Definition :The backgroundImage property sets the background image of an element. Syntex :Object.style.backgroundImage=url(URL)|none
backgroundPosition | The "backgroundPosition" property sets the position of a background-image.
backgroundPositionX | It is a propert of style object.Sets the x-coordinates of the backgroundPosition property.
backgroundPositionY | 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. backgroundPositionY Sets the y-coordinates of the backgroundPosition property
backgroundRepeat | The 'backgroundRepeat' property sets whether or not a background-image should be repeated horizontally, vertically, both or non of them.
border | The border property sets all border properties in one declaration. Syntax Object.style.border=borderWidth borderStyle borderColor
borderBottom | The borderBottom property sets all properties for the bottom border in one declaration. Syntax Object.style.borderBottom=borderWidth borderStyle borderColor
borderBottomColor | The borderBottomColor property sets the color of the bottom border of an element. Syntax Object.style.borderBottomColor=color-name|color-rgb|color-hex
borderBottomStyle | This defines the appearance of the bottom side of the border of an element. It is possible to define type, width and color of the specified element.
borderBottomWidth | borderBottomWidth property sets the width of the bottom border
borderCollapse | This is a style function that allows a table border to be collapsed instead of separated. When a table border is collapsed, the empty cells are ignored, and everything remains in one border.
borderColor | The borderColor property sets the color of the border around an element. This property can take from one to four colors: * If you specify one color, like: table {border-color: red} - all four borders will be red * If you specify two colors, like: table {border-color: red green} - the top and bottom border will be red, left and right border will be green * If you specify three colors, like: table {border-color: red green blue}- the top border will be red, left and right border will be green, bottom border will be blue * If you specify four colors, like: table {border-color: red green blue yellow} - the top border will be red, right border will be green, bottom border will be blue, left border will be yellow Syntax Object.style.borderColor=color-name|color-rgb|color-hex|transparent
borderLeft | The borderLeft property sets all properties for the left border in one declaration.
borderLeftColor | The borderLeftColor property sets the color of the left border of an element. Syntax Object.style.borderLeftColor=color-name|color-rgb|color-hex|transparent
borderLeftStyle | The borderLeftStyle property sets the style of the left border. Syntax Object.style.borderLeftStyle=style
borderLeftWidth | The borderLeftWidth property sets the width of the left border. Syntax Object.style.borderLeftWidth=thin|medium|thick|length
borderRight | The borderRight property sets all properties for the right border in one declaration. Syntax Object.style.borderRight=borderWidth borderStyle borderColor
borderRightColor | 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.borderRightColor sets the color of the right border.
borderRightStyle | The borderRightStyle property sets the style of the right border. Syntax Object.style.borderRightStyle=style
borderRightWidth | The borderRightWidth property sets the width of the right border of an element. Syntax Object.style.borderRightWidth=thin|medium|thick|length
borderSpacing | The borderSpacing property sets the distance between the borders of adjacent cells (only for the "separated borders" model). Syntax Object.style.borderSpacing=length,length
borderStyle | The borderStyle property sets or returns the border style for all four sides in one. This property can take one to four styles. Syntax Object.style.borderStyle=style
borderTop | The borderTop property sets all properties for the top border in one declaration. Syntax Object.style.borderTop=borderWidth borderStyle borderColor
borderTopColor | The borderTopColor property sets the color of the top border of an element. Syntax Object.style.borderTopColor=color-name|color-RGB|color-hex
borderTopStyle | Determines the style of the top border of the Style object.
borderTopWidth | The borderTopWidth property sets the width of the top border of an element. Syntax Object.style.borderTopWidth=thin|medium|thick|length
borderWidth | borderWidth is used to set the width of both left and right border. The possible values of this property borderWidth are thin, medium, thick, or length value.
bottom | The bottom property sets how far the bottom edge of an element is above/below the bottom edge of the parent element. Syntax Object.style.bottom=auto|%|length
captionSide | The captionSide property sets the position of the table caption. Syntax Object.style.captionSide=top|bottom|left|right
clear | The clear property sets on which sides of an element other floating elements are not allowed. Syntax Object.style.clear=left|right|both|none
clip | The clip property sets the shape of an element. What happens if an image is larger than the element it goes inside? - The "clip" property lets you specify the dimensions of an element that should be visible, and the element is clipped into this shape, and displayed. Syntax Object.style.clip=rect(top,right,bottom,left)|auto
color | The color property sets the color of the text. Syntax Object.style.color=color
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 | The cssFloat property sets where an image or text will appear (float) in another element. Syntax Object.style.cssFloat=left|right|none
cssText | 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.cssText sets or retrieves the contents of a style declaration as a string.The CSSValue.cssText and rule.cssText properties are read-only, all others are read/write.
cursor | The cursor property specifies the type of cursor to be displayed. Syntax Object.style.cursor=cursortype
direction | Read/write property that returns the text direction of the element. Valid values are "ltr" (left to right) and "rtl" (right to left). Default is "ltr." Example(s): document.getElementById("mydiv").dir="rtl" //change text direction
display | display property of style object refers to how an object is being displayed. There are various values (none, block, table, inline, etc...), however, the most common usage is to show/hide an object from the screen.
emptyCells | The emptyCells property sets whether or not to show empty cells in a table. Syntax Object.style.emptyCells=hide|show
font | The font property sets all font properties in one declaration. Syntax Object.style.font=value
fontFamily | he fontFamily property specifies a list of font-family names and/or generic-family names for an element. The browser will use the first value it recognizes. There are two types of font-family values: * font-family: The name of a font-family, like "verdana" or "arial" * generic-family: The name of a generic font-family, like "serif" or "sans-serif" Syntax Object.style.fontFamily=font1,font2,....
fontSize | The fontSize property sets the font size of an element. Syntax Object.style.fontSize=value
fontSizeAdjust | 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. The property Sets/adjusts the size of a text.
fontStretch | Definition and Usage The fontStretch property is used to condense or stretch the current font. Syntax Object.style.fontStretch=value
fontStyle | The "fontStyle" property sets the style of the font of an element.
fontVariant | 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.fontVariant Displays text in a small-caps font
fontWeight | The fontWeight property sets the boldness of characters. Syntax Object.style.fontWeight=value
height | The height property sets the height of an element. Syntax Object.style.height=auto|length|%
left | Sets how far the left edge of an element is to the right/left of the left edge of the parent element.
letterSpacing | letterSpacing property of Style object refers to the horizontal spacing between letters in an element. The default value is "normal". The value can be provided in px, %, em, etc.
lineHeight | The lineHeight property sets the distance between lines (sets the line-height). Syntax Object.style.lineHeight=normal|number|length|%
listStyle | The listStyle property sets all list properties in one declaration. Syntax Object.style.listStyle=listStyleType listStylePosition listStyleImage
listStyleImage | The listStyleImage property sets an image as the list-item marker. Syntax Object.style.listStyleImage=url|none
listStylePosition | The list style position property specifies if the if the list-item markers should appear inside or outside the content flow. Outside: Coffee Tea Coca-cola Inside: Coffee Tea Coca-cola
listStyleType | 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.listStyleType sets the list-item marker type.
margin | The margin property sets the margins of an element. This property can take from one to four values: * If you specify one value, like: div {margin: 50px} - all four margins will be 50px * If you specify two values, like: div {margin: 50px 10px} - the top and bottom margins will be 50px, left and right margins will be 10px Syntax Object.style.margin=margin
marginBottom | marginBottom is used to set the bottom margin for an element.ie. the space after the element is displayed.
marginLeft | The marginLeft property sets the left margin of an element. Syntax Object.style.marginLeft=auto|length|%
marginRight | The marginRight property sets the right margin of an element. Syntax Object.style.marginRight=auto|length|%
marginTop | The marginTop property sets the top margin of an element. Syntax Object.style.marginTop=auto|length|%
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 | It sets or gets the maximum height of the visible area of an element.It takes two values either length or %.% defines the maximum height. Length defined in cm,pix etc.
maxWidth | The maxWidth property sets the maximum width of an element. Syntax Object.style.maxWidth=length|%
minHeight | Definition :The minHeight property sets the minimum height of an element. Syntex :Object.style.minHeight=length|%
minWidth | The minWidth property sets the minimum width of an element. Syntax Object.style.minWidth=length|%
orphans | the minimum number of line space to be left after a paragraph is set by using oprhans property in the style tag of a paragraph.
outline | 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. Outline Sets all outline properties in one
outlineColor | The outlineColor property sets the color of the outline around an element. Syntax Object.style.outlineColor=color-name|color-rgb|color-hex
outlineStyle | The outlineStyle property sets the style of the outline around an element. Syntax Object.style.outlineStyle=style
outlineWidth | The outlineWidth property sets the width of the outline around an element. Syntax Object.style.outlineWidth=thin|medium|thick|length
overflow | The "overflow" property specifies what happens if content overflows an element's box.
padding | It is used to set the space between the the content and the border of the field. The value can be specified in length or percentage. A single value sets the all sides, 2 value sets top/bottom & left/right, 3 vales sets top, bottom & left/right and 4 vales sets top, bottom, left & right.
paddingBottom | The paddingBottom property sets the bottom padding of an element. The padding properties define the space between the element border and the element content. Syntax Object.style.paddingBottom=length|%
paddingLeft | The paddingLeft property sets the left padding of an element. The padding properties define the space between the element border and the element content. Syntax Object.style.paddingLeft=length|%
paddingRight | The paddingRight property sets the right padding of an element. The padding properties define the space between the element border and the element content. Syntax Object.style.paddingRight=auto|length|%
paddingTop | The paddingTop property sets the top padding of an element. The padding properties define the space between the element border and the element content. Syntax Object.style.paddingTop=length|%
page | It sets the page type to use when displaying an element.
pageBreakAfter | The pageBreakAfter property sets the page break behavior after an element. It take any one of the value auto,always,avoid,left and right. Auto means it insets the break if necessary. always insert the break always after an element. The avoid value avoids inserting an page break after an element.
pageBreakBefore | The 'pageBreakBefore' property sets the page-break behavior before an object. It can be auto, always, avoid, left, right.
pageBreakInside | Sets the page-breaking behavior inside an element
position | The position property places an element in a static, relative, absolute or fixed position. Syntax Object.style.position=static|relative|absolute|fixed
quotes | The "quotes" property sets the type of quotation marks for embedded quotations.
right | The right property sets how far the right edge of an element is to the left/right of the right edge of the parent element. Syntax Object.style.right=auto|%|length
size | Sets the orientation and size of a page
tableLayout | Sets the algorithm used to display the table cells, rows, and columns
textAlign | The textAlign property aligns the text in an element. Syntax Object.style.textAlign=left|right|center|justify
textDecoration | The 'textDecoration' property specifies the decoration added to text, for example: object.style.textDecoration="overline".
textIndent | The "textIndent" property specifies the indentation of the first line in a text-block.
textShadow | 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. Definition :textShadow--Sets the shadow effect of a text
textTransform | The textTransform property sets capitalization effect on a text. Syntax Object.style.textTransform=none|capitalize|uppercase|lowercase
top | This property sets how far the top edge of an element is above/below the top edge of the parent element.
unicodeBidi | Determines the way bidirectional text (left-to-right and right-to-left text in the same paragraph) is rendered.
verticalAlign | Sets the vertical alignment of content in an element.
visibility | The visibility property sets whether or not an element should be visible. Syntax Object.style.visibility=visible|hidden|collapse
whiteSpace | Sets how to handle line-breaks and white-space in a text
widows | windows property Sets the minimum number of lines for a paragraph at the top of a page.
width | The width property sets the width of an element.
wordSpacing | The wordSpacing property sets the space between words in a text. Syntax Object.style.wordSpacing=normal|length
zIndex | The zIndex property sets the stack order of an element. An element with greater stack order is always in front of another element with lower stack order. Syntax Object.style.zIndex=auto|number

## Methods

Method Name | Description | Values
--- | --- | ---