如何使用CSS仅悬停突出显示表格行？

Question

是否可以使用CSS（无JavaScript）在悬停（类似this）上突出显示表格行？

Answer 1

是的，一行是可能的，但不是一列。

tr:hover { 
    background-color: lightyellow; 
} 

Answer 2

如果你不关心Internet Explorer，在:hover CSS伪类适用于任何元素。

如果您对做了关心IE，您可以找到解决方法here。

Answer 3

是的，它是可能的，但你必须在这里不用担心浏览器的兼容性是一个例子

<style type="text/css"> 
    .tbl {width: 640px;} 
    .tbl tr {background-color: Blue; height: 24px} 
    .tbl tr:hover {background-color: Red;} 
</style> 


<table class="tbl"> 
    <tr><td></td><td></td><td></td></tr> 
    <tr><td></td><td></td><td></td></tr> 
    <tr><td></td><td></td><td></td></tr> 
    <tr><td></td><td></td><td></td></tr> 
</table> 

Answer 4

<style type="text/css"> 
    tr.tr-hover-class:hover { 
     background: grey !important; 
    } 
</style> 

<table> 
    <tr class='tr-hover-class'></tr> 
</table>