在鼠标悬停上更改两行背景颜色
问题描述:
我在表格中有很多行数据,我试图查看是否可以在鼠标悬停的同时突出显示两行。在鼠标悬停上更改两行背景颜色
我可以这样做
<tr onmouseover="this.style.backgroundColor='#aaaaaa';" onmouseout="this.style.backgroundColor='#bbbbbb';">
它一次一行的伟大工程,但所显示的数据是“配对”像下面。第1行和第2,第3和第4行。所以我正在查看是否可以同时突出显示第1行和第2行,当我将鼠标悬停在任一行区域时。那么同为3和4
<tr><td>Row1</td></tr>
<tr><td>Row2</td></tr>
<tr><td>Row3</td></tr>
<tr><td>Row4</td></tr>
答
使用<tbody>
标签组对列在一起,用CSS样式:hover
设置颜色一起。
<html>
<style>
.foo:hover { background-color: #aaaaaa; }
</style>
<body>
<table>
<tbody class="foo">
<tr><td>Row1</td></tr>
<tr><td>Row2</td></tr>
</tbody>
<tbody class="foo">
<tr><td>Row3</td></tr>
<tr><td>Row4</td></tr>
</tbody>
</table>
</body>
</html>
啊完美!谢谢! – Sara 2011-02-06 03:18:24