您的位置:首页 > Web前端 > CSS

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

2012-12-11 00:00 543 查看
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

background
background

background-attachment
backgroundAttachment

background-color
backgroundColor

background-image
backgroundImage

background-position
backgroundPosition

background-repeat
backgroundRepeat

color
color

display
display

list-style-type
listStyleType

list-style-image
listStyleImage

list-style-position
listStylePosition

list-style
listStyle

white-space
whiteSpace

font
font

font-family
fontFamily

font-size
fontSize

font-style
fontStyle

font-variant
fontVariant

font-weight
fontWeight

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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: