js控制CSS样式属性语法对照表

CSS与JS紧密配合,为我们的页面增添了很多别致的效果,为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的CSS属性

CSS与JS紧密配合,为我们的页面增添了很多别致的效果。为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的CSS属性。

例如常用的关闭某个漂浮的广告显示:document.getElementById('ad').style.display='none';相当于:.ad{ display:none}.

下面就是JS 控制CSS样式表的语法对照:

盒子标签和属性对照  
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  
   
样式标签和属性对照  
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  
       
规律:"-"去掉,并把-后面的首字母换成大写      

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wddjxs.html