表格隔行换色 css expression

第一行为其它颜色，这样写这个表达式

<html><head><meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″><title>表格CSS测试</title><style type=”text/css”><!–tr { background-color: expression(this.sectionRowIndex==0?”#AFAFAF”:((this.sectionRowIndex%2==0) ? “#FFF0F0” : “#F0F0FF”));}–></style></head><body bgcolor=”#FFFFFF” leftmargin=”0″ topmargin=”0″><table cellspacing=”1″> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr></table><p> </p><table cellspacing=”1″> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr> <tr> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> <td width=”50″> </td> </tr></table><p> </p></body></html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

比较强的css

<html><head><meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″><title>表格CSS测试</title><style type=”text/css”><!–#DataGrid1 tr { background-color: expression( this.sectionRowIndex == 0 ? “#FFCCCC” : ( (this.sectionRowIndex % 2 == 0) ? “#FFF0F0” : “#F0F0FF” ) ); color: expression(this.sectionRowIndex == 0 ? “#FFFFFF” : “”); font-weight: expression(this.sectionRowIndex == 0 ? “BOLD” : “”); TableSelect: expression( this.sectionRowIndex == 0 ? “” : ( onmouseover = function() { this.style.backgroundColor = ( this.style.backgroundColor != “#69cdff” ? “#69cdff” : ( this.sectionRowIndex == 0 ? “#FFCCCC” : ( this.sectionRowIndex % 2 == 0 ? “#FFF0F0” : “#F0F0FF” ) ) ) }, onmouseout = function() { this.style.backgroundColor = ( this.style.backgroundColor != “#69cdff” ? “#69cdff” : ( this.sectionRowIndex == 0 ? “#FFCCCC” : ( this.sectionRowIndex % 2 == 0 ? “#FFF0F0” : “#F0F0FF” ) ) ) } ) )}#DataGrid1 td { background-color:expression( this.cellIndex == 0 ? ( this.parentElement.sectionRowIndex == 0 ? “#FFCCCC” : “#DDDDDD” ) : null )}.FindAreaTable { font-size: 12px; color: #333333; text-decoration: none; width: 1024px; cursor: hand; background-color: #FFFFFF; vertical-align: middle; text-align: center;}–></style></head><body bgcolor=”#FFFFFF” leftmargin=”0″ topmargin=”0″><table cellspacing=”1″ class=”FindAreaTable” ID=”DataGrid1″> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr> <tr> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> <td>表格测试</td> </tr></table></body></html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

微信