/jsref/
HTML DOM Style 对象

  1. JavaScript对象
    1. JavaScript Array 对象
    2. JavaScript Boolean 对象
    3. JavaScript Date 对象
    4. JavaScript Math 对象
    5. JavaScript Number 对象
    6. JavaScript String 对象
    7. JavaScript RegExp 对象
    8. JavaScript 全局属性/函数
    9. JavaScript 运算符
    10. JavaScript length 属性
  2. Browser对象
    1. Window 对象
    2. Navigator 对象
    3. Screen 对象
    4. History 对象
    5. Location 对象
  3. DOM对象
    1. HTML DOM Document 对象
    2. HTML DOM 元素对象
    3. HTML DOM 属性对象
    4. HTML DOM 事件对象
  4. HTML DOM对象
    1. HTML DOM Anchor 对象
    2. HTML DOM Area 对象
    3. HTML DOM Audio 对象
    4. HTML DOM Object 对象
    5. HTML DOM Blockquote 对象
    6. HTML DOM Body 对象
    7. HTML DOM Button 对象
    8. HTML DOM Canvas 对象
    9. HTML DOM Column 对象
    10. HTML DOM Columngroup对象
    11. HTML DOM Datalist 对象
    12. HTML DOM del 对象
    13. HTML DOM Details 对象
    14. HTML DOM Dialog 对象
    15. HTML DOM Embed 对象
    16. HTML DOM Fieldset 对象
    17. HTML DOM Form 对象
    18. HTML DOM Frame 和 IFrame 对象
    19. HTML DOM Frameset 对象
    20. HTML DOM Image 对象
    21. HTML DOM ins 对象
    22. HTML DOM Button 对象
    23. HTML DOM Checkbox 对象
    24. HTML DOM Input Color 对象
    25. HTML DOM Input Date 对象
    26. HTML DOM Input Datetime 对象
    27. HTML DOM Input DatetimeLocal 对象
    28. HTML DOM Input Email 对象
    29. HTML DOM FileUpload 对象
    30. HTML DOM Hidden 对象
    31. HTML DOM Input Image 对象
    32. HTML DOM Input Month 对象
    33. HTML DOM Input Number 对象
    34. HTML DOM Input Range 对象
    35. HTML DOM Password 对象
    36. HTML DOM Radio 对象
    37. HTML DOM Reset 对象
    38. HTML DOM Input Search 对象
    39. HTML DOM Submit 对象
    40. HTML DOM Input Text 对象
    41. HTML DOM Input Time 对象
    42. HTML DOM Input URL 对象
    43. HTML DOM Input Week 对象
    44. HTML DOM Keygen 对象
    45. HTML DOM Link 对象
    46. HTML DOM Label 对象
    47. HTML DOM Legend 对象
    48. HTML DOM Li 对象
    49. HTML DOM Map 对象
    50. HTML DOM Menu 对象
    51. HTML DOM MenuItem 对象
    52. HTML DOM Meta 对象
    53. HTML DOM Meter 对象
    54. HTML DOM Ol 对象
    55. HTML DOM OptionGroup 对象
    56. HTML DOM Option 对象
    57. HTML DOM Parameter 对象
    58. HTML DOM Progress 对象
    59. HTML DOM 引用对象( <q>)
    60. HTML DOM Script 对象
    61. HTML DOM Select 对象
    62. HTML DOM Source 对象
    63. HTML DOM Style 对象
    64. HTML DOM Table 对象
    65. HTML DOM td / th 对象
    66. HTML DOM TableHeader 对象
    67. HTML DOM tr 对象
    68. HTML DOM Textarea 对象
    69. HTML DOM title 属性
    70. HTML DOM Time 对象
    71. HTML DOM Track 对象
    72. HTML DOM Video 对象
  5. HTML DOM 事件对象
    1. onmouseleave 事件
    2. onpaste 事件
    3. onpageshow 事件
    4. onpagehide 事件
    5. ondurationchange 事件
    6. onsuspend 事件
    7. onprogress 事件
    8. animationstart 事件
    9. onseeked 事件
    10. which 事件属性
    11. metaKey 事件属性
    12. onoffline 事件
    13. button 事件属性
    14. relatedTarget 事件属性
    15. onshow 事件
    16. clientX 事件属性
    17. screenX 事件属性
    18. ontoggle 事件
    19. clientY 事件属性
    20. bubbles 事件属性
    21. ctrlKey 事件属性
    22. shiftKey Event 属性
    23. cancelable 事件属性
    24. location 事件属性
    25. currentTarget 事件属性
    26. key 事件属性
    27. timeStamp 事件属性
  6. HTML DOM Body 对象
    1. HTML DOM Body aLink 属性
    2. HTML DOM Body bgColor 属性
    3. HTML DOM Body link 属性
    4. HTML DOM Body text 属性
    5. HTML DOM Body vLink 属性
  7. HTML DOM del 对象
    1. HTML DOM del dateTime 属性
    2. HTML DOM del cite 属性
  8. HTML DOM Fieldset 对象
    1. HTML DOM Fieldset disabled 属性
    2. HTML DOM Fieldset form 属性
    3. HTML DOM Fieldset name 属性
  9. HTML DOM Dialog 对象
    1. HTML DOM Dialog open 属性
    2. HTML DOM Dialog close() 方法
    3. HTML DOM Dialog show() 方法
  10. HTML DOM Frame 和 IFrame 对象
    1. HTML DOM Frame/IFrame contentDocument 属性
    2. HTML DOM Frame/IFrame frameBorder 属性
    3. HTML DOM IFrame height 属性
    4. HTML DOM Frame/IFrame longDesc 属性
    5. HTML DOM Frame/IFrame marginHeight 属性
    6. HTML DOM Frame/IFrame marginWidth 属性
    7. HTML DOM Frame/IFrame name 属性
    8. HTML DOM Frame/IFrame src 属性
    9. HTML DOM IFrame width 属性
  11. HTML DOM Submit 对象
    1. HTML DOM Submit form 属性
    2. HTML DOM Submit name 属性
    3. HTML DOM Submit type 属性
  12. HTML DOM 引用对象
    1. HTML DOM 引用对象 cite 属性
  13. HTML DOM Input Number 对象
    1. HTML DOM Input Number disabled 属性
    2. HTML DOM Input Number form 属性
    3. HTML DOM Input Number placeholder 属性
    4. HTML DOM Input Number type 属性
  14. HTML DOM Password 对象
    1. HTML DOM Password defaultValue 属性
  15. HTML DOM Link 对象
    1. HTML DOM Link hreflang 属性
  16. HTML DOM Script 对象
    1. HTML DOM Script src 属性
    2. HTML DOM Script defer 属性
    3. HTML DOM Script src 属性
  17. HTML DOM Select 对象
    1. HTML DOM Select options 集合
  18. 拓展阅读
    1. js中setinterval怎么用？怎么才能让setinterval停下来？
阅读(2661) 赞(0)

HTML DOM Style 对象

2016-08-04 20:38:21 更新

Style 对象表示一个个别的样式声明。

访问 Style 对象

Style 对象可以从文档的头部区域访问，或者从指定的 HTML 元素访问。

从文档的头部区域访问 style 对象：

var x = document.getElementsByTagName("STYLE");尝试一下

访问一个指定元素的 style 对象：

var x = document.getElementById("myH1").style;尝试一下

创建 Style 对象

您可以使用 document.createElement() 方法来创建 <style> 元素：

var x = document.createElement("STYLE");尝试一下

您也可以设置一个已有元素的 style 属性：

document.getElementById("myH1").style.color = "red";尝试一下

Style 对象属性

"CSS" 列表示该属性是在哪一个 CSS 版本中定义的（CSS1、CSS2 或 CSS3）。

属性 描述 CSS
alignContent 设置或返回当灵活容器内的各项没有占用所有可用的空间时各项之间的对齐方式（水平）。 3
alignItems 设置或返回灵活容器内的各项的对齐方式。 3
alignSelf 设置或返回灵活容器内被选中项目的对齐方式。 3
animation 是下面除了 animationPlayState 属性之外的其他属性的速记属性。 3
animationDelay 设置或返回动画何时开始。 3
animationDirection 设置或返回是否循环交替反向播放动画。 3
animationDuration 设置或返回动画完成需花费的秒数或毫秒数。 3
animationFillMode 设置或返回当动画不播放时（当动画完成时，或当动画有一个延迟未开始播放时），要应用到元素的样式。 3
animationIterationCount 设置或返回动画的播放次数。 3
animationName 设置或返回关键帧 @keyframes 动画的名称。 3
animationTimingFunction 设置或返回动画的速度曲线。 3
animationPlayState 设置或返回动画是运行的还是暂停的。 3
background 设置或返回在一个声明中的所有背景属性。 1
backgroundAttachment 设置或返回背景图像是否固定或随页面滚动。 1
backgroundColor 设置或返回元素的背景色。 1
backgroundImage 设置或返回元素的背景图像。 1
backgroundPosition 设置或返回的背景图像的起始位置。 1
backgroundRepeat 设置或返回如何重复背景图像。 1
backgroundClip 设置或返回背景的绘制区域。 3
backgroundOrigin 设置或返回背景图像的定位区域。 3
backgroundSize 设置或返回背景图像的大小。 3
backfaceVisibility 设置或返回当一个元素背对屏幕时是否可见。 3
border 设置或返回在一个声明中的 borderWidth、borderStyle 和 borderColor。 1
borderBottom 设置或返回在一个声明中的所有 borderBottom* 属性。 1
borderBottomColor 设置或返回下边框的颜色。 1 
borderBottomLeftRadius 设置或返回左下角边框的形状。 3
borderBottomRightRadius 设置或返回右下角边框的形状。 3
borderBottomStyle 设置或返回下边框的样式。 1
borderBottomWidth 设置或返回下边框的宽度。 1
borderCollapse 设置或返回表格的边框是否被折叠为一个单一的边框。 2
borderColor 设置或返回元素边框的颜色（最多可以有四个值）。 1
borderImage 一个用于设置或返回所有的 borderImage* 属性的速记属性。 3
borderImageOutset 设置或返回边框图像区域超出边界框的量。 3
borderImageRepeat 设置或返回图像边框是重复拼接图块还是延伸图块。 3
borderImageSlice 设置或返回图像边框的向内偏移。 3
borderImageSource 设置或返回要作为边框使用的图像。 3
borderImageWidth 设置或返回图像边框的宽度。 3
borderLeft 设置或返回在一个声明中的所有 borderLeft* 属性。 1
borderLeftColor 设置或返回左边框的颜色。 1
borderLeftStyle 设置或返回左边框的样式。 1
borderLeftWidth 设置或返回左边框的宽度。 1
borderRadius 一个用于设置或返回四个 border*Radius 属性的速记属性。 3
borderRight 设置或返回在一个声明中的所有 borderRight* 属性。 1
borderRightColor 设置或返回右边框的颜色。 1
borderRightStyle 设置或返回右边框的样式。 1
borderRightWidth 设置或返回右边框的宽度。 1
borderSpacing 设置或返回表格中单元格之间的距离。 2
borderStyle 设置或返回元素边框的样式（最多可以有四个值）。 1
borderTop 设置或返回在一个声明中的所有 borderTop* 属性。 1
borderTopColor 设置或返回上边框的颜色。 1
borderTopLeftRadius 设置或返回左上角边框的形状。 3
borderTopRightRadius 设置或返回右上角边框的形状。 3
borderTopStyle 设置或返回上边框的样式。 1
borderTopWidth 设置或返回上边框的宽度。 1
borderWidth 设置或返回元素边框的宽度（最多可以有四个值）。 1
bottom 设置或返回定位元素的底部位置。 2
boxDecorationBreak 设置或返回分页处元素的背景和边框行为，或者换行处内联元素的背景和边框行为。 3
boxShadow 设置或返回元素的下拉阴影。 3
boxSizing 允许您以特定的方式定义匹配某个区域的特定元素。 3
captionSide 设置或返回表格标题的位置。 2
clear 设置或返回元素相对浮动对象的位置。 1
clip 设置或返回定位元素的可见部分。 2
color 设置或返回文本的颜色。 1
columnCount 设置或返回元素应该被划分的列数。 3
columnFill 设置或返回如何填充列。 3
columnGap 设置或返回列之间的间隔。 3
columnRule 一个用于设置或返回所有的 columnRule* 属性的速记属性。 3
columnRuleColor 设置或返回列之间的颜色规则。 3
columnRuleStyle 设置或返回列之间的样式规则。 3
columnRuleWidth 设置或返回列之间的宽度规则。 3
columns 一个用于设置或返回 columnWidth 和 columnCount 的速记属性。 3
columnSpan 设置或返回一个元素应横跨多少列。 3
columnWidth 设置或返回列的宽度。 3
content 与 :before 和 :after 伪元素一起使用，来插入生成的内容。 2
counterIncrement 增加一个或多个计数器。 2
counterReset 创建或重置一个或多个计数器。 2
cursor 设置或返回鼠标指针显示的光标类型。 2
direction 设置或返回文本的方向。 2
display 设置或返回元素的显示类型。 1
emptyCells 设置或返回是否显示表格中的空单元格的边框和背景。 2
filter 设置或返回图片滤镜(可视效果，如：高斯模糊与饱和度) 3
flex 相对于同一容器其他灵活的项目，设置或返回项目的长度。 3
flexBasis 设置或灵活项目的初始长度。 3
flexDirection 设置或返回灵活项目的方向。 3
flexFlow 是 flexDirection 和 flexWrap 属性的速记属性。 3
flexGrow 设置或返回项目将相对于同一容器内其他灵活的项目进行扩展的量。 3
flexShrink 设置或返回项目将相对于同一容器内其他灵活的项目进行收缩的量。 3
flexWrap 设置或返回灵活项目是否拆行或拆列。 3
cssFloat 设置或返回元素的水平对齐方式。 1
font 设置或返回一个声明中的 fontStyle、fontVariant、fontWeight、fontSize、lineHeight 和 fontFamily。 1
fontFamily 设置或返回文本的字体。 1
fontSize 设置或返回文本的字体尺寸。 1
fontStyle 设置或返回字体样式是否是 normal（正常的）、italic（斜体）或 oblique（倾斜的）。 1
fontVariant 设置或返回是否以小型大写字母显示字体。 1
fontWeight 设置或返回字体的粗细。 1
fontSizeAdjust 当使用备用字体时，确保文本的可读性。 3
fontStretch 从字体库中选择一种正常的、浓缩的或扩大的字体。 3
hangingPunctuation 规定一个标点符号是否可以放置在线框外。 3
height 设置或返回元素的高度。 1
hyphens 设置如何拆分单词来提高段落布局。 3
icon 向作者提供为一个带有等价于图标的元素定义样式的功能。 3
imageOrientation 规定一个用户代理应用到图像上的顺时针方向的旋转。 3
justifyContent 设置或返回当灵活容器内的各项没有占用所有可用的空间时各项之间的对齐方式（垂直）。 3
left 设置或返回定位元素的左部位置。 2
letterSpacing 设置或返回文本中字符之间的空间。 1
lineHeight 设置或返回在文本中行之间的距离。 1
listStyle 设置或返回一个声明中的 listStyleImage、listStylePosition 和 listStyleType。 1
listStyleImage 设置或返回作为列表项标记的图像。 1
listStylePosition 设置或返回列表项标记的位置。 1
listStyleType 设置或返回列表项标记的类型。 1
margin 设置或返回元素的外边距（最多可以有四个值）。 1
marginBottom 设置或返回元素的的下外边距。 1
marginLeft 设置或返回元素的左外边距。 1
marginRight 设置或返回元素的右外边距。 1
marginTop 设置或返回元素的上外边距。 1
maxHeight 设置或返回元素的最大高度。 2
maxWidth 设置或返回元素的最大宽度。 2
minHeight 设置或返回元素的最小高度。 2
minWidth 设置或返回元素的最小宽度。 2
navDown 设置或返回当使用向下箭头导航键时要导航到哪里。 3
navIndex 设置或返回元素的显示顺序。 3
navLeft 设置或返回当使用向左箭头导航键时要导航到哪里。 3
navRight 设置或返回当使用向右箭头导航键时要导航到哪里。 3
navUp 设置或返回当使用向上箭头导航键时要导航到哪里。 3
opacity 设置或返回元素的不透明度。 3
order 设置或返回一个灵活的项目相对于同一容器内其他灵活项目的顺序。 3
orphans 设置或返回当元素内有分页时，必须在页面底部预留的最小行数。 2
outline 设置或返回在一个声明中的所有 outline 属性。 2
outlineColor 设置或返回一个元素周围的轮廓颜色。 2
outlineOffset 对轮廓进行偏移，并在边框边缘进行绘制。 3
outlineStyle 设置或返回一个元素周围的轮廓样式。 2
outlineWidth 设置或返回一个元素周围的轮廓宽度。 2
overflow 设置或返回如何处理呈现在元素框外面的内容。 2
overflowX 规定如果内容溢出元素的内容区域，是否对内容的左/右边缘进行裁剪。 3
overflowY 规定如果内容溢出元素的内容区域，是否对内容的上/下边缘进行裁剪。 3
padding 设置或返回元素的内边距（最多可以有四个值）。 1
paddingBottom 设置或返回元素的下内边距。 1
paddingLeft 设置或返回元素的左内边距。 1
paddingRight 设置或返回元素的右内边距。 1
paddingTop 设置或返回元素的上内边距。 1
pageBreakAfter 设置或返回元素后的分页行为。 2
pageBreakBefore 设置或返回元素前的分页行为。 2
pageBreakInside 设置或返回元素内的分页行为。 2
perspective 设置或返回 3D 元素被查看的视角。 3
perspectiveOrigin 设置或返回 3D 元素的底部位置。 3
position 设置或返回用于元素定位方法的类型（static、relative、absolute 或 fixed）。 2
quotes 设置或返回嵌入引用的引号类型。 2
resize 设置或返回是否可由用户调整元素的尺寸大小。 3
right 设置或返回定位元素的右部位置。 2
tableLayout 设置或返回表格单元格、行、列的布局方式。 2
tabSize 设置或返回制表符（tab）字符的长度。 3
textAlign 设置或返回文本的水平对齐方式。 1
textAlignLast 设置或返回当 text-align 属性设置为 "justify" 时，如何对齐一个强制换行符前的最后一行。 3
textDecoration 设置或返回文本的修饰。 1
textDecorationColor 设置或返回文本修饰的颜色。 3
textDecorationLine 设置或返回文本修饰要使用的线条类型。 3
textDecorationStyle 设置或返回文本修饰中的线条样式。 3
textIndent 设置或返回文本第一行的缩进。 1
textJustify 设置或返回当 text-align 属性设置为 "justify" 时，要使用的对齐方法。 3
textOverflow 设置或返回当文本溢出包含它的元素，应该发生什么。 3
textShadow 设置或返回文本的阴影效果。 3
textTransform 设置或返回文本的大小写。 1
top 设置或返回定位元素的顶部位置。 2
transform 向元素应用 2D 或 3D 转换。 3
transformOrigin 设置或返回被转换元素的位置。 3
transformStyle 设置或返回被嵌套的元素如何呈现在 3D 空间中。 3
transition 一个用于设置或返回四个过渡属性的速记属性。 3
transitionProperty 应用过渡效果的 CSS 属性的名称。 3
transitionDuration 设置或返回完成过渡效果需要花费的时间（以秒或毫秒计）。 3
transitionTimingFunction 设置或返回过渡效果的速度曲线。 3
transitionDelay 设置或返回过渡效果何时开始。 3
unicodeBidi 设置或返回文本是否被重写，以便在同一文档中支持多种语言。 2
verticalAlign 设置或返回元素中内容的垂直对齐方式。 1
visibility 设置或返回元素是否应该是可见的。 2
whiteSpace 设置或返回如何处理文本中的制表符、换行符和空格符。 1
width 设置或返回元素的宽度。 1
wordBreak 设置或返回非 CJK 语言的换行规则。 3
wordSpacing 设置或返回文本中单词之间的空间。 1
wordWrap 允许长单词或 URL 地址换行到下一行。 3
widows 设置或返回一个元素必须在页面顶部的可见行的最小数量。 2
zIndex 设置或返回定位元素的堆叠顺序。 2


← HTML DOM Source 对象
HTML DOM Table 对象 →

推荐文章

推荐教程

技术文章