Object ng Style ng HTML DOM

Objekto ng Style

Ang Objekto ng Style ay kinakatawan ng nag-iisang paglililinaw ng estilo.

Attribute ng Objekto ng Style

Attribute Paglalarawan
alignContent Iseto o ibalik ang paraan ng alinlangan ng mga linya sa loob ng container ng elasticity, kapag ang mga proyekto ay hindi gumagamit ng lahat ng magagamit na espasyo.
alignItems Iseto o ibalik ang paraan ng alinlangan ng proyekto sa ilalim ng container ng elasticity.
alignSelf Iseto o ibalik ang paraan ng alinlangan ng napiling proyekto sa ilalim ng container ng elasticity.
animation Ang maikling attribute ng lahat ng attribute ng animation, maliban sa animationPlayState.
animationDelay Iseto o ibalik kung ang animation ay dapat magsimula kung ano ang oras.
animationDirection Iseto o ibalik kung ang animation ay dapat magpalit ng direksiyon sa pagitan ng pagpalit ng direksiyon.
animationDuration Iseto o ibalik ang oras na kailangan ng animation para makumpleto ang isang bukas-bukas.
animationFillMode Iseto o ibalik ang halaga na dapat gamitin sa labas ng oras ng pagpapatupad ng animation.
animationIterationCount Iseto o ibalik ang bilang ng beses na dapat ipalabas ang animation.
animationName Iseto o ibalik ang pangalan ng animation ng @keyframes.
animationPlayState Iseto o ibalik kung ang animation ay tumatakbo o pinahinto.
animationTimingFunction Iseto o ibalik ang kurva ng katipunan ng katipunan ng animation.
background Iseto o ibalik ang lahat ng attribute ng background sa isang statement.
backgroundAttachment Iseto o ibalik kung ang background image ay nakasadsad o sumasailalim sa paggalaw ng pahina.
backgroundClip Iseto o ibalik ang lugar ng pagpipinta ng background.
backgroundColor Iseto o ibalik ang kulay ng background ng elemento.
backgroundImage Iseto o ibalik ang background image ng elemento.
backgroundOrigin 设置或返回背景图像的定位区域。
backgroundPosition Set or return the positioning area of the background image.
backgroundPosition Set or return the starting position of the background image.
backgroundRepeat Set or return how the background image is repeated (tiled).
backgroundSize Set or return the size of the background image.
backfaceVisibility Set or return whether the element is visible when not facing the screen.
borderBottom Set or return all borderBottom properties in a single declaration.
borderBottomColor Set or return the color of the bottom border.
borderBottomLeftRadius Set or return the shape of the bottom-left border.
borderBottomRightRadius Set or return the shape of the bottom-right border.
borderBottomStyle Set or return the style of the bottom border.
borderBottomWidth Set or return the width of the bottom border.
borderCollapse Set or return whether the table border should be collapsed into a single border.
borderColor Set or return the color of the element border (up to four values can be set).
borderImage A shorthand property for setting or returning all borderImage properties.
borderImageOutset Set or return the amount by which the border image area extends beyond the border box.
borderImageRepeat Set or return whether the image border should repeat, wrap, or stretch.
borderImageSlice Set or return the inward offset of the image border.
borderImageSource Set or return the image used as the border.
borderImageWidth Set or return the width of the image border.
borderLeft Set or return all borderLeft properties in a single declaration.
borderLeftColor Set or return the color of the left border.
borderLeftStyle Set or return the style of the left border.
borderLeftWidth Set or return the width of the left border.
borderRadius A shorthand property for setting or returning all four borderRadius properties.
borderRight Set or return all borderRight properties in a single declaration.
borderRightColor Set or return the color of the right border.
borderRightStyle set or return the style of the right border.
borderRightWidth set or return the width of the right border.
borderSpacing set or return the space between cells in the table.
borderStyle set or return the style of the element border (up to four values can be set).
borderTop set or return all borderTop properties in one declaration.
borderTopColor set or return the color of the top border.
borderTopLeftRadius set or return the shape of the top left border.
borderTopRightRadius set or return the shape of the top right border.
borderTopStyle set or return the style of the top border.
borderTopWidth set or return the width of the top border.
borderWidth set or return the width of the element border (up to four values can be set).
bottom set or return the bottom position of the positioned element.
boxDecorationBreak set or return the behavior of the background and border of the element during pagination, or for inline elements, the behavior when wrapping.
boxShadow attach one or more shadows to the box (box).
boxSizing allows you to define certain elements to fit a certain area in a certain way.
captionSide set or return the position of the table caption.
caretColor set or return the color of the insertion symbol/cursor of the element.
clear set or return the position of the element relative to the floating object.
clip set or return which part of the positioned element is visible.
color set or return the color of the text.
columnCount set or return the number of columns the element should be divided into.
columnFill set or return how columns should be filled.
columnGap set or return the gap between columns.
columnRule A shorthand attribute used to set or return all columnRule properties.
columnRuleColor set or return the color of the rule between columns.
columnRuleStyle set or return the style of the rule between columns.
columnRuleWidth set or return the width of the rule between columns.
columns A shorthand attribute used to set or return columnWidth and columnCount.
columnSpan set or return how many columns the element should span.
columnWidth set or return the width of the column.
content Used with :before and :after pseudo-elements to insert generated content.
counterIncrement Increment one or more counters.
counterReset Create or reset one or more counters.
cursor Set or return the cursor type displayed by the mouse pointer.
direction Set or return the text direction.
display Set or return the display type of the element.
emptyCells Set or return whether the border and background of empty cells should be displayed.
filter Set or return the image filter (visual effects such as blur and saturation).
flex Set or return the length of the item, relative to the rest of the content.
flexBasis Set or return the initial length of the flexible item.
flexDirection Set or return the direction of the flexible item.
flexFlow Abbreviated properties of flexDirection and flexWrap.
flexGrow Set or return the growth amount of the item relative to other items.
flexShrink Set or return the shrinkage method of the item relative to other items.
flexWrap Set or return whether the flexible item should break to a new line.
cssFloat Set or return the horizontal alignment method of the element.
font Set or return font properties in a single declaration.
fontFamily Set or return the font family of the text.
fontSize Set or return the font size of the text.
fontStyle Set or return whether the font style is normal, italic, or oblique.
fontVariant Set or return whether the font should be displayed in small caps.
fontWeight Set or return the thickness of the font.
fontSizeAdjust Maintain the readability of the text when font fallback occurs.
fontStretch Select the stretching deformation method from the font family.
hangingPunctuation Specify whether punctuation marks can be placed outside the line box.
height Set or return the height of the element.
hyphens Set how to split words to improve the layout of the paragraph.
icon Enable the author to use iconic equivalents to set the style of the element.
imageOrientation Specify the rotation of the user agent applied to the image in the right or clockwise direction.
isolation Define whether an element must create new stacking content.
justifyContent Set or return the alignment method between items inside a flexible container when not all available space is used.
left Set or return the left position of the定位element.
letterSpacing Iseto o ibalik ang espasyo sa pagitan ng mga character ng teksto.
lineHeight Iseto o ibalik ang distansya sa pagitan ng linya ng teksto.
listStyle Iseto o ibalik ang listahen ng estilo sa isang pahayag.
listStyleImage Iseto o ibalik ang larawan bilang marka ng item ng listahan.
listStylePosition Iseto o ibalik ang posisyon ng marka ng item ng listahan.
listStyleType Iseto o ibalik ang uri ng marka ng item ng listahan.
margin Iseto o ibalik ang labi ng elemento (makakakuha ng hanggang apat na halaga).
marginBottom Iseto o ibalik ang ilalim na labi ng elemento.
marginLeft Iseto o ibalik ang kaliwang labi ng elemento.
marginRight Iseto o ibalik ang kanang labi ng elemento.
marginTop Iseto o ibalik ang mataas na labi ng elemento.
maxHeight Iseto o ibalik ang pinakamalaking taas ng elemento.
maxWidth Iseto o ibalik ang pinakamalaking lapad ng elemento.
minHeight Iseto o ibalik ang pinakamaliit na taas ng elemento.
minWidth Iseto o ibalik ang pinakamaliit na lapad ng elemento.
navDown Iseto o ibalik ang posisyon ng paglalakbay kapag ginagamit ang navigation key na may pambalik na pilak sa ilalim.
navIndex Iseto o ibalik ang pagkakasunod-sunod ng paglalakbay ng elemento.
navLeft Iseto o ibalik ang posisyon ng paglalakbay kapag ginagamit ang navigation key na may pambalik na pilak sa kaliwa.
navRight Iseto o ibalik ang posisyon ng paglalakbay kapag ginagamit ang navigation key na may pambalik na pilak sa kanan.
navUp Iseto o ibalik ang posisyon ng paglalakbay kapag ginagamit ang navigation key na may pambalik na pilak.
objectFit Tukuyin kung paano ang nilalaman ng pinalit na elemento ay dapat maugnay sa kahon na binuo ng ginamit na taas at lapad.
objectPosition Tukuyin ang paraan kung paano magtutugma ang nilalaman ng pinalit na elemento sa kahon nito.
opacity Iseto o ibalik ang antas ng opakidad ng elemento.
order Iseto o ibalik ang pagkakasunod-sunod ng flexible item sa mga ibang item.
orphans Iseto o ibalik ang pinakamaliit na bilang ng linya na dapat mananatili sa ilalim ng pahina kapag nangyayari ang pahahalata sa loob ng elemento.
outline Iseto o ibalik ang lahat ng atribute ng outline sa isang pahayag.
outlineColor Iseto o ibalik ang kulay ng linya ng elemento sa paligid.
outlineOffset Ialoc ang linya ng linya at ihalang sa labi ng bariwari.
outlineStyle Iseto o ibalik ang estilo ng linya ng elemento sa paligid.
outlineWidth Iseto o ibalik ang lapad ng linya ng elemento sa paligid.
overflow Iseto o ibalik ang paraan kung paano paghawakin ang nilalaman na lumalabas sa labi ng kahon ng elemento.
overflowX Tinutukoy kung paano paghawak ng kaliwang/dexterang bahagi ng nilalaman ng elemento kapag lumalabas ito sa sakop ng nilalaman ng elemento.
overflowY Specify how to handle the top/bottom edges of the content, if it overflows the content area of the element.
padding Set or return the inner padding of the element (up to four values can be set).
paddingBottom Set or return the bottom inner padding of the element.
paddingLeft Set or return the left inner padding of the element.
paddingRight Set or return the right inner padding of the element.
paddingTop Set or return the top inner padding of the element.
pageBreakAfter Set or return the pagination behavior after the element.
pageBreakBefore Set or return the pagination behavior before the element.
pageBreakInside Set or return the pagination behavior within the element.
perspective Set or return how to view the perspective of 3D elements.
perspectiveOrigin Set or return the bottom position of the 3D element.
position Set or return the type of positioning method used for the element (static, relative, absolute, or fixed).
quotes Set or return the type of quotes for embedded quotes.
resize Set or return whether the element can be resized by the user.
right Set or return the right position of the定位element.
scrollBehavior Specify whether there is a smooth scrolling animation effect when the user clicks on a link within a scrollable box, rather than jumping directly.
tableLayout Set or return the layout method of table cells, rows, and columns.
tabSize Set or return the length of the tab.
textAlign Set or return the horizontal alignment method of the text.
textAlignLast When text-align is set to "justify", set or return how the last line of the block or the line before the forced line break is aligned.
textDecoration Set or return text decoration.
textDecorationColor Set or return the color of text decoration.
textDecorationLine Set or return the line type in text decoration.
textDecorationStyle Set or return the style of the line in text decoration.
textIndent Set or return the indentation of the first line of text.
textJustify Set or return the alignment method used when text-align is set to "justify".
textOverflow Set or return what should happen when the text overflows the containing element.
textShadow Set or return the shadow effect of the text.
textTransform 设置或返回文本的大小写。
top 设置或返回定位元素的顶部位置。
transform 对元素应用 2D 或 3D 变换。
transformOrigin 设置或返回被转换元素的位置。
transformStyle 设置或返回嵌套元素在 3D 空间中的渲染方式。
transition 用于设置或返回四个转换属性的简写属性。
transitionProperty 设置或返回过渡效果的 CSS 属性。
transitionDuration 设置或返回过渡效果完成所需的秒数或毫秒数。
transitionTimingFunction 设置或返回过渡效果的速度曲线。
transitionDelay 设置或返回过渡效果何时开始。
unicodeBidi 设置或返回是否应覆盖文本以支持同一文档中的多种语言。
userSelect 设置或返回是否可以选择元素的文本。
verticalAlign 设置或返回元素中内容的垂直对齐方式。
visibility 设置或返回元素是否可见。
whiteSpace I-set o i-balik kung paano mapapatakbo ang tab, salitang pagsasalita at espasyong puwang sa teksto.
width I-set o i-balik ang lapad ng elemento.
wordBreak I-set o i-balik ang patakaran ng pagsasalita ng mga non-CJK script.
wordSpacing I-set o i-balik ang space sa gitna ng mga salita sa teksto.
wordWrap Payagan ang mahabang, hindi mapaghihiwalay na salita na mabasag at ilipat sa susunod na linya.
widows I-set o i-balik ang pinakamaliit na bilang ng halina na dapat na maging nakita sa itaas ng pahina ang elemento.
zIndex I-set o i-balik ang stack order ng naaayos na elemento.

Bumalik sa Style object

Maaari kang bumalik sa style object mula sa bahagi ng head ng dokumento o mula sa tiyak na HTML elemento.

halimbawa 1

Bumalik sa style object mula sa bahagi ng head ng dokumento:

var x = document.getElementsByTagName("STYLE");

Try It Yourself

halimbawa 2

Bumalik sa style object ng tinukoy na elemento:

var x = document.getElementById("myH1").style;

Try It Yourself

Gumawa ng Style object

halimbawa 1

Maaari kang gumawa ng <style> elemento gamit ang methodong document.createElement();

var x = document.createElement("STYLE");

Try It Yourself

halimbawa 2

您还可以设置现有元素的样式属性:

document.getElementById("myH1").style.color = "red";

Try It Yourself

Related Pages

HTML Tutorial:HTML CSS

CSS Tutorial:CSS Tutorial

HTML Reference Manual:HTML <style> Tag

CSS Reference Manual:CSS Properties