若是想在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 |
同左 |
|
|
留言列表