<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<styletype="text/css">
*{margin:0;padding:0;font-size:14px}
body{text-align:center;}
#btn{list-style:noneinside;width:210px;margin:10pxauto;clear:both;}
#btnli{float:left;width:100px;line-height:20px}
#btnlia{display:block;text-decoration:none;color:#333333}
#gray{background:#f5f5f5;cursor:pointer}
#green{background:#D7ECDE;cursor:pointer}
table{border-collapse:collapse;width:70%;margin:10pxauto}
td{line-height:100%;height:24px;line-height:24px;padding:04px}
tda{text-decoration:none;color:#333;display:block;}
#tab_graytd{border:1pxsolid#B9B9B9;background:#F2F2F2;}
#tab_greentd{border:1pxsolid#95CCA7;background:#EBF5EE;}
#tab_graytd:hover,#tab_greentd:hover{background:#fff;}
</style>
</head>
<body>
<ulid="btn">
<liid="gray"><ahref="javascript:void()"onclick="gray()">gray</a></li>
<liid="green"><ahref="javascript:void()"onclick="green()">green</a></li>
</ul>
<tableid="tab_gray">
<tr>
<td><ahref="#">Table</a></td>
<td><ahref="#">Table</a></td>
<td><ahref="#">Table</a></td>
</tr>
<tr>
<td>hello</td>
<td>hello</td>
<td>hello</td>
</tr>
<tr>
<td>hello</td>
<td>hello</td>
<td>hello</td>
</tr>
</table>
<scriptlanguage="javascript">
functiongreen(){
document.getElementById("tab_gray").id="tab_green";
}
functiongray(){
document.getElementById("tab_green").id="tab_gray";
}
</script>
</body>
</html>
【js兼容标准的表格变色效果】相关文章：
★ js输入中文效果