若是想在javascript中設定CSS樣式及style樣式(程式碼形式為:document物件.style.style子屬性=值;),必須注意,各種style子屬性及其值的程式碼名稱在javascript中不盡相同,這是很麻煩的一點。以下是各CSS和style子屬性對應在javascript中的程式碼名稱(對應的規則為:CSS/style子屬性中的-符號去除、-符號後之字母改為大寫):
|
CSS/style 子屬性 |
javascrip中名稱 |
|
文字: |
|
|
font-size |
fontSize |
|
font-family |
fontFamily |
|
font-style |
fontStyle |
|
font-weight |
fontWeight |
|
text-align |
textAlign |
|
text-decoration |
textDecoration |
|
letter-spacing |
letterSpacing |
|
line-height |
lineHeight |
|
color |
同左 |
|
背景: |
|
|
background-color |
backgroundColor |
|
background-image |
backgroundImage |
|
background-position |
backgroundPosition |
|
background-repeat |
backgroundRepeat |
|
background-attachment |
backgroundAttachment |
|
定位: |
|
|
position |
同左 |
|
top |
同左 |
|
left |
同左 |
|
bottom |
同左 |
|
right |
同左 |
|
z-index |
zIndex |
|
長寬: |
|
|
height |
同左 |
|
width |
同左 |
|
邊框: |
|
|
border |
同左 |
|
border-color |
borderColor |
|
border-top-color |
borderTopColor |
|
border-bottom-color |
borderBottomColor |
|
border-left-color |
borderLeftColor |
|
border-right-color |
borderRightColor |
|
border-width |
borderWidth |
|
border-top- width |
borderTopWidth |
|
border-bottom- width |
borderBottomWidth |
|
border-left- width |
borderLeftWidth |
|
border-right- width |
borderRightWidth |
|
滑鼠鼠標: |
|
|
cursor |
同左 |
|
內外邊界: |
|
|
margin |
同左 |
|
padding |
同左 |
|
margin-top |
marginTop |
|
margin-bottom |
marginBottom |
|
margin-left |
marginLeft |
|
margin-right |
marginRight |
|
padding-top |
paddingTop |
|
padding-bottom |
paddingBottom |
|
padding-left |
paddingLeft |
|
padding-right |
paddingRight |
|
其他: |
|
|
display |
同左 |
|
|
|
留言列表
