HTML DOM Style object
Style object
The Style object represents an individual style declaration.
Access the Style object
Style objects can be accessed from the header area of the document, or from specified HTML elements.
Access the style object from the header area of the document:
Access the style object of a specified element:
Create a Style object
You can use the document.createElement() method to create the element of the .lt;style:
You can also set a style property for an existing element:
Style object properties
The CSS column indicates which CSS version the property is defined in (CSS1, CSS2, or CSS3).
Attributes | describe | CSS |
---|---|---|
alignContent | Setting or returning to alignment (level) between the items in the flexible container does not take all the available spaces. | 3 |
alignItems | Set or return the alignment of the various items in the flexible container. | 3 |
alignSelf | Set or return alignment of the selected items in the flexible container. | 3 |
animation | It is the shorthand attribute of other attributes other than the AnimationPlayState property below. | 3 |
animationDelay | Set or return to when to start. | 3 |
animationDirection | Set or return to whether the loop is alternately reverse play animation. | 3 |
animationDuration | Set or return the number of seconds or milliseconds that need to be taken to complete. | 3 |
animationFillMode | Set or returns when the animation is not played (when the animation is completed, or when there is a delay when the movie is not started, it is to be applied to the style of the element. | 3 |
animationIterationCount | Set or return to the number of animations. | 3 |
animationName | Set or return to the name of the keyframe @keyframes animation. | 3 |
animationTimingFunction | Set or return the speed curve of the animation. | 3 |
animationPlayState | Setting or returning animation is running or paused. | 3 |
background | Set or return all background properties in a declaration. | 1 |
backgroundAttachment | Set or return to the background image to be fixed or scroll with the page. | 1 |
backgroundColor | Set or return the background color of the element. | 1 |
backgroundImage | Set or return to the background image of the element. | 1 |
backgroundPosition | Set or returned the starting position of the background image. | 1 |
backgroundRepeat | Set or return how to repeat the background image. | 1 |
backgroundClip | Set or return to the background of the drawing area. | 3 |
backgroundOrigin | Set or return the positioning area of the background image. | 3 |
backgroundSize | Set or return the size of the background image. | 3 |
backfaceVisibility | Set or return to whether it is visible when an element is back to the screen. | 3 |
border | Set or return BorderWidth, BorderWidth, Borderstyle, and BorderColor in a declaration. | 1 |
borderBottom | Set or return all borderbottom * properties in a declaration. | 1 |
borderBottomColor | Set or return the color of the lower border. | 1 |
borderBottomLeftRadius | Set or returns the shape of the lower left corner border. | 3 |
borderBottomRightRadius | Set or returns the shape of the lower right corner border. | 3 |
borderBottomStyle | Set or return the style of the lower border. | 1 |
borderBottomWidth | Set or return the width of the lower frame. | 1 |
borderCollapse | Set or return the border of the table to be folded into a single border. | 2 |
borderColor | Set or return the color of the element border (up to four values). | 1 |
borderImage | A shorthair attribute for setting or returning all BorderImage * properties. | 3 |
borderImageOutset | Setting or return the boundary image area beyond the amount of boundary box. | 3 |
borderImageRepeat | Setting or return the image frame is a repeated splicing block or an extension block. | 3 |
borderImageSlice | Set or return to the inward offset of the image border. | 3 |
borderImageSource | Set or return an image to be used as a border. | 3 |
borderImageWidth | Set or return the width of the image border. | 3 |
borderLeft | Set or return all borderleft * properties in a declaration. | 1 |
borderLeftColor | Set or return the color of the left box. | 1 |
borderLeftStyle | Set or return the style of the left box. | 1 |
borderLeftWidth | Set or return the width of the left box. | 1 |
borderRadius | A shorthair attribute for setting or returning four Border * Radius properties. | 3 |
borderRight | Set or return all BorderRight * properties in a declaration. | 1 |
borderRightColor | Set or return the color of the right border. | 1 |
borderRightStyle | Set or return the style of the right frame. | 1 |
borderRightWidth | Set or return the width of the right border. | 1 |
borderSpacing | Set or return the distance between cells in the table. | 2 |
borderStyle | Set or return the style of the element border (up to four values). | 1 |
borderTop | Set or return all BordERTOP * properties in a declaration. | 1 |
borderTopColor | Set or return the color of the upper frame. | 1 |
borderTopLeftRadius | Set or returns the shape of the upper left upper frame. | 3 |
borderTopRightRadius | Set or return the shape of the upper right corner frame. | 3 |
borderTopStyle | Set or return the style of the upper frame. | 1 |
borderTopWidth | Set or return the width of the upper frame. | 1 |
borderWidth | Set or return the width of the element border (up to four values). | 1 |
bottom | Set or return the bottom position of the locating element. | 2 |
boxDecorationBreak | Set or return to the background and border behavior of the elements at the paging, or the background and border behavior of the inline elements. | 3 |
boxShadow | Set or return the chain. | 3 |
boxSizing | Allows you to define specific elements that match a certain area in a specific manner. | 3 |
captionSide | Set or return to the location of the table title. | 2 |
clear | Set or return the location of the element relative floating object. | 1 |
clip | Set or return the visible portion of the locating element. | 2 |
color | Set or return to the color of the text. | 1 |
columnCount | Set or return elements should be divided into the number of columns. | 3 |
columnFill | Set or return how to fill the column. | 3 |
columnGap | Set or return the interval between columns. | 3 |
columnRule | A shorthair property for setting or returning all columnRule * properties. | 3 |
columnRuleColor | Set or return the color rules between columns. | 3 |
columnRuleStyle | Set or return the style rules between columns. | 3 |
columnRuleWidth | Set or return the width rule between columns. | 3 |
columns | A shorthair attribute for setting or returning ColumnWidth and ColumnCount. | 3 |
columnSpan | Set or return an element to how many columns should be across. | 3 |
columnWidth | Set or return the width of the column. | 3 |
content | Use: Before and: After pseudo element to insert the generated content. | 2 |
counterIncrement | Add one or more counters. | 2 |
counterReset | Create or reset one or more counters. | 2 |
cursor | Set or return the cursor type displayed by the mouse pointer. | 2 |
direction | Set or return the direction of the text. | 2 |
display | Set or return the display type of the element. | 1 |
emptyCells | Set or return to whether or not to display the border and background of the empty units in the table. | 2 |
filter | Set or return to the image filter (visual effect, such as Gaussian blurring and saturation) | 3 |
flex | Compared to other flexible projects of the same container, set or return the length of the project. | 3 |
flexBasis | The initial length of setting or flexible project. | 3 |
flexDirection | Set or return the direction of the flexible project. | 3 |
flexFlow | It is the shorthand attribute of the FlexDirection and FlexWrap properties. | 3 |
flexGrow | Setting or return the item will extend with other flexible projects in the same container. | 3 |
flexShrink | Setting or return the item will be contracted with other flexible items in the same container. | 3 |
flexWrap | Set or return to the flexible project to remove or remove. | 3 |
cssFloat | Set or return the level of elements to alignment. | 1 |
font | Set or return to FontStyle, Fontvariant, Fontweight, Fontsize, LineHeight, and FontFamily, in a statement. | 1 |
fontFamily | Set or return the font of the text. | 1 |
fontSize | Set or return the font size of the text. | 1 |
fontStyle | Set or return to whether or not the font pattern is Normal (normal), italic (slope) or oblique (tilted). | 1 |
fontVariant | Set or return to whether the font is displayed in a small capital letter. | 1 |
fontWeight | Set or return the thickness of the font. | 1 |
fontSizeAdjust | When using a spare font, make sure the readability of the text. | 3 |
fontStretch | Select a normal, concentrated or expanded font from the font library. | 3 |
hangingPunctuation | Specifies whether a punctuation can be placed outside the wireframe. | 3 |
height | Set or return the height of the element. | 1 |
hyphens | Set how to split words to increase paragraph layout. | 3 |
icon | Provide the author to a function of defining a style with an equivalent icon. | 3 |
imageOrientation | It is specified that a user agent is applied to the clockwise direction of the image. | 3 |
justifyContent | Set or return to the alignment (vertical) between the items in the flexible container does not take all the available spaces. | 3 |
left | Set or return the left position of the locating element. | 2 |
letterSpacing | Set or return the space between characters in text. | 1 |
lineHeight | Set or return the distance between the lines of the text. | 1 |
listStyle | Set or return ListStyleImage, ListStyposition, and ListStyletype in a declaration. | 1 |
listStyleImage | Set or returns an image as a list item tag. | 1 |
listStylePosition | Set or return to the location of the list item tag. | 1 |
listStyleType | Set or return to the type of the list item tag. | 1 |
margin | Set or return the outer distance of the element (up to four values). | 1 |
marginBottom | Set or return the lower outer margin of the element. | 1 |
marginLeft | Set or return the left outer margin of the element. | 1 |
marginRight | Set or return the right outer margin of the element. | 1 |
marginTop | Set or return an upper outer margin of the element. | 1 |
maxHeight | Set or return the maximum height of the element. | 2 |
maxWidth | Set or return the maximum width of the element. | 2 |
minHeight | Set or return the minimum height of the element. | 2 |
minWidth | Set or return the minimum width of the element. | 2 |
navDown | Set or return to where to navigate when using the down arrow navigation button. | 3 |
navIndex | Set or return the display order of the elements. | 3 |
navLeft | Set or return to where to navigate when using the left arrow navigation key. | 3 |
navRight | Set or return to where to navigate when using the right arrow navigation key. | 3 |
navUp | Set or return to where to navigate when using an arrow navigation key. | 3 |
opacity | Set or return the opacity of the element. | 3 |
order | Set or return a flexible item relative to other flexible projects in the same container. | 3 |
orphans | Setting or returning When there is a paging within an element, you must reserve the minimum number of rows at the bottom of the page. | 2 |
outline | Set or return all OUTLINE properties in a declaration. | 2 |
outlineColor | Set or return the contour color around an element. | 2 |
outlineOffset | The contour is shifted and drawing on the edge edge. | 3 |
outlineStyle | Set or return the contour style around an element. | 2 |
outlineWidth | Set or return the contour width around an element. | 2 |
overflow | Set or return how to process the content presentation outside the element box. | 2 |
overflowX | It is specified whether the left / right edge of the content is cropped if the content area of the content is overflow. | 3 |
overflowY | It is specified whether the upper / lower edge of the content is cropped if the content area of the content is overflow. | 3 |
padding | Set or return the inner margin (up to four values). | 1 |
paddingBottom | Set or return the lower margins of the elements. | 1 |
paddingLeft | Set or return the left side margin of the element. | 1 |
paddingRight | Set or return the right within the elements. | 1 |
paddingTop | Set or return the upper margins of the elements. | 1 |
pageBreakAfter | Set or return paging behavior after the elements. | 2 |
pageBreakBefore | Set or return paging behavior before element. | 2 |
pageBreakInside | Set or return paging behavior within the element. | 2 |
perspective | Set or return a 3D element viewed perspective. | 3 |
perspectiveOrigin | Set or returns the bottom position of the 3D element. | 3 |
position | Set or return the type (Static, Relative, Absolute or Fixed) for element location methods. | 2 |
quotes | Set or return the quotation type type of embedded reference. | 2 |
resize | Set or return to whether or not the size of the element can be adjusted by the user. | 3 |
right | Set or return the right position of the locating element. | 2 |
tableLayout | Set or return the layout of the table cell, row, column. | 2 |
tabSize | Set or return the length of the tab (Tab) character. | 3 |
textAlign | Set or return to the horizontal alignment of text. | 1 |
textAlignLast | Set or return How to align a last line before the wrap is set when the text-align property is set to "Justify". | 3 |
textDecoration | Set or return to the text of the text. | 1 |
textDecorationColor | Set or return to the color of text. | 3 |
textDecorationLine | Set or return text modification to use the line type. | 3 |
textDecorationStyle | Set or return to the line style in text modification. | 3 |
textIndent | Set or return to the first row of text. | 1 |
textJustify | Set or return When the text-align property is set to "Justify", the alignment method is used. | 3 |
textOverflow | Set or return When the text overflows contains its elements, what should happen. | 3 |
textShadow | Set or return the shadow effect of the text. | 3 |
textTransform | Set or return to the case. | 1 |
top | Set or return the top position of the locating element. | 2 |
transform | 2D or 3D conversion is applied to the element. | 3 |
transformOrigin | Set or returns the position of the converted element. | 3 |
transformStyle | Set or return to how the nested element is presented in a 3D space. | 3 |
transition | A shorthair attribute for setting or returning four transition properties. | 3 |
transitionProperty | The name of the CSS attribute of the transition effect. | 3 |
transitionDuration | Set or return to completing the time (in seconds or millisecond meter) that requires the transition effect. | 3 |
transitionTimingFunction | Set or return the speed curve of the transition effect. | 3 |
transitionDelay | When setting or return a transition effect when starting. | 3 |
unicodeBidi | Set or return text to be rewritten to support multiple languages in the same document. | 2 |
verticalAlign | Set or return the vertical alignment of the content in the element. | 1 |
visibility | Whether setting or return elements should be visible. | 2 |
whiteSpace | Set or returns how to process tabs, newlines, and space characters in text. | 1 |
width | Set or return the width of the element. | 1 |
wordBreak | Set or returns a wrap rule for non-CJK languages. | 3 |
wordSpacing | Set or return the space between words in text. | 1 |
wordWrap | Allow long words or URL addresses to go down to the next row. | 3 |
widows | Set or return an element to the minimum number of visible rows at the top of the page. | 2 |
zIndex | Set or return the stacking order of the locating element. | 2 |