本文介绍了一种使用CSS简化隔行变色的方法，通过expression属性动态改变表格行的背景颜色，避免了在JSP中使用Java脚本进行复杂的条件判断。
以前在做页面显示列表时候，要做一组数据隔行变色，当时不知道，竟然用来了好多java脚本判断，写了许多像下面的例子。
Html代码
- <table>
- <%intc=0;%>
- //循环取列表
- <%
- if(c%2==0)
- {
- className="一种颜色";
- }else
- {
- className="另外一种颜色";
- }
- c++;
- %>
- <trlcass="className">
- <td></td>
- </tr>
- //循环结束
- </table>
<table>
<%int c =0;%>
//循环取列表
<%
if (c % 2 == 0)
{
className = "一种颜色";
} else
{
className = "另外一种颜色";
}
c++;
%>
<tr lcass="className">
<td></td>
</tr>
//循环结束
</table>
某一天才发现有如下的方法，可以直接在css中写：
.Pop_TR{
background-color:expression(this.rowIndex%2==0 ? "一种颜色":"另一种颜色");
cursor:hand;
}
这样，想展示上面的样式，只需要这样写：
Html代码
- <table>
- //循环取列表
- <trlcass="Pop_TR">
- <td></td>
- </tr>
- //循环结束
- </table>
<table>
//循环取列表
<tr lcass="Pop_TR">
<td></td>
</tr>
//循环结束
</table>
这样一来，的确减少了不少代码，jsp中也不需要写那些丑陋的java脚本了。css技术，还真要下一番功夫去研究。
扫一扫
1218
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
