Html, one auto-numbered column
<table>
<tr>
<td>Num</td>
<td>Name</td>
</tr>
<? foreach {{ ?>
<tr>
<td>here this must be html auto increment number</td>
<td>this will be from database</td>
<tr>
<? endforeach; ?>
</table>
<td>Num</td>
should automatically increment the number on the page. Is it possible to do this in HTML without any JavaScript or some other simple solution?
+3
source to share
1 answer
You can try using counter-increment
:
table {
counter-reset: tableCount;
}
.counterCell:before {
content: counter(tableCount);
counter-increment: tableCount;
}
<table>
<tr>
<td>Num</td>
<td>Name</td>
</tr>
<tr>
<td class="counterCell"></td>
<td>this will be from database</td>
</tr>
<tr>
<td class="counterCell"></td>
<td>this will be from database</td>
</tr>
</table>
Support that seems pretty good: http://caniuse.com/#feat=css-counters
+3
source to share