js控制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
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
空白	空白
字體	字體
字型系列	字型系列
字體大小	字體大小
字體樣式	字體樣式
字體變體	字體變體
字型粗細	字型粗細
字母間距	字母間距
換行	換行
行高	行高
文字對齊	文字對齊
文字裝飾	文字裝飾
文字縮排	文字縮排
文字對齊	文字對齊
文字轉換	文字轉換
垂直對齊	垂直對齊