Table TR hover效果

今天我在给一个站增加一个table的hover效果，也就是鼠标移上去，有一个效果，像a链接一样鼠标移上去有一个变色的效果，网上找了半天，终于找到。用onMouse实现的。很简洁的几行代码，把代码记在这里下，方便自己也方便后遇到这样问题的朋友。
分为两部分

第一部分：CSS部分

既然是hover效果，我们就要有一个css来定义。
style如下：

1 2	.tr-over{background-color:#F3F3F3;} .tr-out{background-color:#FFF;}

第二部分：html代码部分

1
2
3
4
5
6
7
8

<table style="width:320px; table-layout:fixed;">
<tr onclick="location='#'" onmouseover="this.className='tr-over'" onmouseout="this.className='tr-out'">
<td width=35% style="white-space:nowrap; overflow:hidden;">第一列相当长，是一个例子</td>
<td width=20%>第二列</td>
<td width=30%>第三列</td>
<td width=15%>第四列</td>
</tr>
</table>