|
首先，把CSS和JS标签style属性对照表了解了：
CSS 和 JavaScript 标签 style 属性对照表：
盒子标签和属性对照
|
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 |
颜色和背景标签和属性对照
|
CSS 语法（不区分大小写） |
JavaScript 语法（区分大小写） |
|
background |
background |
|
background-attachment |
backgroundAttachment |
|
background-color |
backgroundColor |
|
background-image |
backgroundImage |
|
background-position |
backgroundPosition |
|
background-repeat |
backgroundRepeat |
|
color |
color |
|
|
样式标签和属性对照
|
CSS语法（不区分大小写） |
JavaScript 语法（区分大小写） |
|
display |
display |
|
list-style-type |
listStyleType |
|
list-style-image |
listStyleImage |
|
list-style-position |
listStylePosition |
|
list-style |
listStyle |
|
white-space |
whiteSpace |
|
|
文字样式标签和属性对照
|
CSS 语法（不区分大小写） |
JavaScript 语法（区分大小写） |
|
font |
font |
|
font-family |
fontFamily |
|
font-size |
fontSize |
|
font-style |
fontStyle |
|
font-variant |
fontVariant |
|
font-weight |
fontWeight |
|
|
文本标签和属性对照
|
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
|
HTML代码示例：
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
-
<HTML>
-
<HEAD>
-
<TITLE> New Document </TITLE>
-
</HEAD>
-
-
<BODY>
-
<input type="text" name="name" >
-
</BODY>
-
</HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>
<input type="text" name="name" >
</BODY>
</HTML>
js代码示例：
-
<script language="javascript">
-
function validate(){
-
if (document.all("name").value == ""){
-
document.all("name").style["borderColor"]="red";
-
return;
-
}
-
}
-
</script>
|
