We would like to know how to label each row of an HTML table numerically.
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
body {<!-- w w w .j a va2 s. co m-->
counter-reset: chapter;
}
tr:before {
content: counter(chapter);
counter-increment: chapter;
padding-right: 5px;
}
</style>
</head>
<body>
<table>
<tr>
<td>some data</td>
</tr>
<tr>
<td>more data</td>
</tr>
<tr>
<td>some more data</td>
</tr>
<tr>
<td>even more data</td>
</tr>
</table>
</body>
</html>
The code above is rendered as follows: