JavaScript 语句参考手册JavaScript Array对象JavaScript Boolean对象JavaScript Date对象JavaScript Math对象JavaScript Number对象JavaScript String对象JavaScript RegExp对象JavaScript 全局JavaScript 运算符使用window 对象navigator 对象screen 对象history 对象location 对象HTML DOMDocument 对象HTML DOM 元素对象HTML DOM 属性对象HTML DOM 事件HTML DOM Anchor 对象HTML DOM Area 对象HTML DOM Audio 对象HTML DOM Base 对象HTML DOM Blockquote 对象HTML DOM Body 对象HTML DOM Button 对象HTML DOM Canvas 对象HTML DOM Column 对象HTML DOM Columngroup 对象HTML DOM Datalist 对象HTML DOM Del 对象HTML DOM Details 对象HTML DOM Dialog 对象HTML DOM Embed 对象HTML DOM Fieldset 对象HTML DOM Form 对象HTML DOM Frame 和 IFrame 对象HTML DOM Frameset 对象HTML DOM Image 对象HTML DOM ins 对象HTML DOM Button对象HTML DOM Checkbox 对象HTML DOM Input Color 对象HTML DOM Input Date 对象HTML DOM Input Datetime 对象HTML DOM Input DatetimeLocalHTML DOM Input Email 对象HTML DOM FileUpload 对象HTML DOM Hidden 对象HTML DOM Input Image 对象HTML DOM Input Month 对象HTML DOMInput Number对象HTML DOM Input Range 对象HTML DOM Password 对象HTML DOM Radio 对象HTML DOM Reset 对象HTML DOM Input Search 对象HTML DOM Submit 对象HTML DOM Input Text 对象HTML DOM Input Time对象HTML DOM Input URL 对象HTML DOM Input Week 对象HTML DOM Keygen 对象HTML DOM Link 对象HTML DOM Label 对象HTML DOM Legend 对象HTML DOM Li 对象HTML DOM Map 对象HTML DOM Menu 对象HTML DOM MenuItem 对象HTML DOM Meta 对象HTML DOM Meter 对象HTML DOM Object 对象HTML DOM Ol 对象HTML DOM OptionGroup 对象HTML DOM Option 对象HTML DOM Parameter 对象HTML DOM Progress 对象HTML DOM Quote 对象HTML DOM Script 对象HTML DOM Select 对象HTML DOM Source 对象HTML DOM Style 对象HTML DOM Table 对象HTML DOM td/th 对象HTML DOM TableHeader 对象HTML DOM HTMLTableRow 对象HTML DOM Textarea 对象HTML DOM Title 对象HTML DOM Time 对象HTML DOM Track 对象HTML DOM Video 对象

HTML DOM Style 对象

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 和 borderColor1
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 和 fontFamily1
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 和 listStyleType1
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

链接: https://fly63.com/course/10_681