表格隔行换色 css expression 2005年11月30日 第一行为其它颜色，这样写这个表达式<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>比较强的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>
