Question

当我将鼠标悬停在此行中的单元格上时，在CSS中是否有任何方法可以更改由3列组成的表格中行的背景颜色？

table tr:hover
{
    background-color:blue;
}

似乎不起作用。

更新

我正在使用Mozilla Firefox，它仅在我将鼠标悬停在<th>而不是<td>

时才有效

Answer 1

使用以下语法：

tr.hover > td:hover
{
    background-color: blue;
}

<tr class="hover">
    <td>;lajsdfl;jasdl;jasd;f</td>
    <td>;lajsdfl;jasdl;jasd;f</td>
</tr>

小提琴：http://jsfiddle.net/DQ9Vz/

Answer 2

TR：悬停{ 背景色：红色; }

Answer 3

这对我来说很好用：

http://jsfiddle.net/EJ63m/

<html>
<head>
<style>
table tr:hover
{
    background-color:blue;
}
</style>
</head>
<body>
<table>
    <tr><td>Foo</td><td>Bar</td><td>FooBar</td></tr>
    <tr><td>Bar</td><td>Foo</td><td>FooBar</td></tr>
</table>
</body>
</html>

您使用的浏览器是什么？

Answer 4

这就解决了它。

table tr:hover > td
{
    background-color:aqua;
}

将鼠标悬停在该行中的单元格上时如何更改行颜色

4 个答案: