We would like to know how to hover to highlight table cell.
<!DOCTYPE HTML>
<html>
<head>
<style type='text/css'>
table {<!-- w ww.ja va 2s . com-->
table-layout: fixed;
}
td, th {
width: 400px;
min-width: 400px;
height: 100px;
}
th {
background: #ffe;
text-align: center;
}
td {
background: #fef;
}
th:hover {
background: #ff8;
}
td:hover {
background: #f8f;
}
</style>
</head>
<body>
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
The code above is rendered as follows: