栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

浅析JavaScript中的CSS属性及命名规范

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

浅析JavaScript中的CSS属性及命名规范

许多CSS样式属性的名字中都有连字符,在Javascript中,连字符被解释为减号。

因此,CSS2Properties对象的属性名和真正的CSS属性名有点不同。

如果一个CSS属性名含有一个或多个连字符,在JS中则需要删除了连字符,并且原来紧接在连字符后的字母改为大写。

要注意的是float是JS的关键字,所以在JS中float被写作cssFloat与或floatStyle。

下面是CSS自身属性与Javascript中CSS编码对照表:


盒子标签和属性对照:
Code
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(ie) cssFloat(FF) 
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

 

颜色和背景标签和属性对照:
Code
CSS语法 (不区分大小写)   Javascript语法 (区分大小写)
background   background
background-attachment   backgroundAttachment
background-color   backgroundColor
background-image   backgroundImage
background-position   backgroundPosition
background-repeat   backgroundRepeat
color   color


样式标签和属性对照:

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


文字样式标签和属性对照:

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

 

文本标签和属性对照:
Code
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

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/109248.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号