js怎么改变css属性值


当前第2页 返回上一页

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

<div id="t2">欢迎光临!</div>

<p><button onclick="setSize()">大小</button>

<button onclick="setColor()">颜色</button>

<button onclick="setbgColor()">背景</button>

<button onclick="setBd()">边框</button>

</p>

 

<script type="text/javascript">

function setSize()

{

document.getElementById( "t2" ).style.fontSize = "30px";

}

function setColor()

{

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

}

function setbgColor()

{

document.getElementById( "t2" ).style.backgroundColor = "blue";

}

function setBd()

{

document.getElementById( "t2" ).style.border = "3px solid #FA8072";

}

</script>

方法:

document.getElementById("xx").style.xxx中的所有属性是什么

盒子标签和属性对照
CSS语法(不区分大小写)JavaScript语法(区分大小写)
borderborder
border-bottomborderBottom
border-bottom-colorborderBottomColor
border-bottom-styleborderBottomStyle
border-bottom-widthborderBottomWidth
border-colorborderColor
border-leftborderLeft
border-left-colorborderLeftColor
border-left-styleborderLeftStyle
border-left-widthborderLeftWidth
border-rightborderRight
border-right-colorborderRightColor
border-right-styleborderRightStyle
border-right-widthborderRightWidth
border-styleborderStyle
border-topborderTop
border-top-colorborderTopColor
border-top-styleborderTopStyle
border-top-widthborderTopWidth
border-widthborderWidth
clearclear
floatfloatStyle
marginmargin
margin-bottommarginBottom
margin-leftmarginLeft
margin-rightmarginRight
margin-topmarginTop
paddingpadding
padding-bottompaddingBottom
padding-leftpaddingLeft
padding-rightpaddingRight
padding-toppaddingTop
颜色和背景标签和属性对照
CSS 语法(不区分大小写)JavaScript 语法(区分大小写)
backgroundbackground
background-attachmentbackgroundAttachment
background-colorbackgroundColor
background-imagebackgroundImage
background-positionbackgroundPosition
background-repeatbackgroundRepeat
colorcolor
样式标签和属性对照
CSS语法(不区分大小写)JavaScript 语法(区分大小写)
displaydisplay
list-style-typelistStyleType
list-style-imagelistStyleImage
list-style-positionlistStylePosition
list-stylelistStyle
white-spacewhiteSpace
文字样式标签和属性对照
CSS 语法(不区分大小写)JavaScript 语法(区分大小写)
fontfont
font-familyfontFamily
font-sizefontSize
font-stylefontStyle
font-variantfontVariant
font-weightfontWeight
文本标签和属性对照
CSS 语法(不区分大小写)JavaScript 语法(区分大小写)
letter-spacingletterSpacing
line-breaklineBreak
line-heightlineHeight
text-aligntextAlign
text-decorationtextDecoration
text-indenttextIndent
text-justifytextJustify
text-transformtextTransform
vertical-align

verticalAlign

【推荐学习:javascript高级教程

以上就是js怎么改变css属性值的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

为什么使用vue的作用域插槽?什么时候使用?

javascript简称什么

深入解析javascript中的作用域

深入分析ajax的进度事件(附示例)

vue实现可视化可拖放的自定义表单(代码示例)

javascript怎么删除对象的属性

javascript可以放在css中吗

css实现基于用户滚动应用(代码)

深入分析js函数

javascript检测出当前浏览器是否是无头浏览器

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...