用jquery实现双色表格，鼠标移动到上面时，行变色~！

先看效果：

姓名	年龄	性别	QQ
opper	23	男	12070
opper	23	男	12070
opper	23	男	12070
opper	23	男	12070
opper	23	男	12070
opper	23	男	12070

代码如下：

<script type="text/javascript" src="https://files.cnblogs.com/opper/jquery.js"></script>
<script language="javascript"><!--
    $(document).ready(function(){
   $(".csstab tr").mouseover(function(){$(this).addClass("over");}).mouseout(function(){$(this).removeClass("over");})
   $(".csstab tr:even").addClass("alt");
    });
// --></script>
<style type="text/css"><!--
th {
        background:#0066FF;
        color:#FFFFFF;
        line-height:20px;
        height:30px;
}
td {
        padding:6px 11px;
        border-bottom:1px solid #95bce2;
        vertical-align:top;
        text-align:center;
}
 
td * {
        padding:6px 11px;
}
tr.alt td {
        background:#ecf6fc;  /*这行将给所有的tr加上背景色*/
}
 
tr.over td {
        background:#bcd4ec;  /*这个将是鼠标高亮行的背景色*/
        cursor:pointer;
}
--></style>
</p>
<div>
<table width="400" cellspacing="0" class="csstab">
<thead>
<tr>
<th>姓名</th><th>年龄</th><th>性别</th><th>QQ</th>
</tr>
</thead>
<tbody>
<tr>
<td>opper</td>
<td>23</td>
<td>男</td>
<td>56791700</td>
</tr>
<tr>
<td>opper</td>
<td>23</td>
<td>男</td>
<td>56791700</td>
</tr>
<tr>
<td>opper</td>
<td>23</td>
<td>男</td>
<td>56791700</td>
</tr>
<tr>
<td>opper</td>
<td>23</td>
<td>男</td>
<td>56791700</td>
</tr>
<tr>
<td>opper</td>
<td>23</td>
<td>男</td>
<td>56791700</td>
</tr>
<tr>
<td>opper</td>
<td>23</td>
<td>男</td>
<td>56791700</td>
</tr>
</tbody>
</table>
</div>
<div>代码如下：</div>

.csstab tr:even

even tr偶数行~！