<div>

    <style>

        /* Start counter from 0 inside tbody */

        tbody#lineitem {

            counter-reset: rowNumber;

        }

        /* Increment counter for each row */

        tbody#lineitem tr {

            counter-increment: rowNumber;

        }

        /* Show counter value in first column */

        tbody#lineitem tr td:first-child::before {

            content: counter(rowNumber);

            font-size: 10px;

            font-family: Calibri;

        }

    </style>

    <table style="width: 100%; border-collapse: collapse; text-align: center; max-width: 100%;" cellpadding="5" cellspacing="0" border="1">

        <thead style="background:#f2f2f2; font-weight:bold;">

            <tr>

                <th style="width:5%;">S.No</th>

                <th style="width:45%;">Item Name</th>

                <th style="width:20%;">HSN</th>

                <th style="width:15%;">Quantity</th>

                <th style="width:15%;">Amount</th>

            </tr>

        </thead>

        <tbody id="lineitem">

            <tr>

                <td></td>

                <td style="text-align:left;">Item 1</td>

                <td>7208</td>

                <td>10</td>

                <td>5000<br></td>

            </tr>

        </tbody>

    </table>

    <div><br></div>

</div>