CSS属性与JavaScript 编码方法对照表

css与js紧密配合，为我们的页面增添了很多别致的效果。为了达到某种特殊的效果我们需要用javascript动态的去更改某一个标签的css属性。比如：鼠标经过一个图片时我们让图片加一个边框，代码可能是这样：javascript中style后面的属性应该是什么？

JavaScript CSS Style属性对照表

盒子标签和属性对照

立即学习“Java免费学习笔记（深入）”；

CSS语法 (不区分大小写) 　　JavaScript语法 (区分大小写) 
border 　　                            border 
border-bottom 　　                 borderBottom 
border-bottom-color 　　       borderBottomColor 
border-bottom-style　　         borderBottomStyle 
border-bottom-width 　　       borderBottomWidth 
border-color 　　                   borderColor 
border-left 　　                      borderLeft 
border-left-color 　　             borderLeftColor 
border-left-style 　　              borderLeftStyle 
border-left-width 　　            borderLeftWidth 
border-right 　　                   borderRight 
border-right-color 　　           borderRightColor 
border-right-style 　　           borderRightStyle 
border-right-width 　　          borderRightWidth 
border-style 　　                   borderStyle 
border-top 　　                     borderTop 
border-top-color 　　            borderTopColor 
border-top-style 　　             borderTopStyle 
border-top-width 　　            borderTopWidth 
border-width 　　                   borderWidth 
clear 　　                              clear 
float　　                                floatStyle 
margin 　　                           margin 
margin-bottom 　　               marginBottom 
margin-left 　　                     marginLeft 
margin-right 　　                   marginRight 
margin-top 　　                     marginTop 
padding 　　                         padding 
padding-bottom 　　              paddingBottom 
padding-left 　　                   paddingLeft 
padding-right 　　                 paddingRight 
padding-top　　                    paddingTop

颜色和背景标签和属性对照

CSS语法 (不区分大小写) 　　JavaScript语法 (区分大小写) 
background 　　                    background 
background-attachment 　　 backgroundAttachment 
background-color　　             backgroundColor 
background-image 　　           backgroundImage 
background-position　　        backgroundPosition 
background-repeat 　　         backgroundRepeat 
color 　　                               color

AlibabaWOOD

阿里巴巴打造的多元电商视频智能创作平台

下载

样式标签和属性对照

CSS语法 (不区分大小写) 　　JavaScript语法 (区分大小写) 
display 　　                           display 
list-style-type　　                  listStyleType 
list-style-image 　　              listStyleImage 
list-style-position　　            listStylePosition 
list-style　　                          listStyle 
white-space　　                    whiteSpace

文字样式标签和属性对照

CSS语法 (不区分大小写) 　　JavaScript语法 (区分大小写) 
font　　                                  font 
font-family　　                        fontFamily 
font-size　　                           fontSize 
font-style　　                         fontStyle 
font-variant　　                      fontVariant 
font-weight 　　                      fontWeight

文本标签和属性对照

CSS语法 (不区分大小写) 　　JavaScript语法 (区分大小写) 
letter-spacing　　                  letterSpacing 
line-break　　                        lineBreak 
line-height　　                        lineHeight 
text-align　　                          textAlign 
text-decoration 　　                textDecoration 
text-indent 　　                       textIndent 
text-justify　　                          textJustify 
text-transform 　　                  textTransform 
vertical-align　　                    verticalAlign