We would like to know how to change background color on rows, but not row headers when hover.
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
table tbody td:hover {<!-- w w w. ja v a 2 s . c o m-->
background: #f00;
}
table tbody tr:hover {
background: #00f;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
<th>Col 3</th>
<th>Col 4</th>
</tr>
</thead>
<tbody>
<tr>
<td>Col 1</td>
<td>Col 2</td>
<td>Col 3</td>
<td>Col 4</td>
</tr>
</tbody>
</table>
</body>
</html>
The code above is rendered as follows: