<div>
<table>
<thead>
<tr>
<th>Nombre</th>
<th>Precio</th>
<th>Stock</th>
</tr>
</thead>
<tbody>
<tr>
<td>Manzanas</td>
<td>1.5€</td>
</tr>
<tr>
<td>Peras</td>
<td>2.4€</td>
</tr>
<tr>
<td>Naranjas</td>
<td>5€</td>
</tr>
<tr>
<td>Platanaos</td>
<td>2€</td>
</tr>
<tr>
<td>Melones</td>
<td>3.5€</td>
</tr>
</tbody>
</table>
<div>
<b>Cantidad de alimentos:</b>
<span class="total"></span>
</div>
</div>
body{
counter-reset: cant-alimentos;
}
table tbody tr{
counter-increment: cant-alimentos;
}
.total::before{
content: counter(cant-alimentos);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.