add border to every n column to an HTML table without CSS

Question

I am really new to HTML and I'd like to add a border to certain columns as a divider.

I would like my table to have borders like this:

| Username | Round 1 | PR | Bonus | Round 2 | PR | Bonus | Total | Rank |
 ---------- --------- ---- ------- --------- ---- ------- ------- ------
| abc123   |   4        1     2   |    12      1     2   |   22     1   |
| xyz123   |   3        0     0   |     5      1     0   |   9      2   |

Please see my HTML code below. I do not have CSS thanks.

<table class="table table-striped">
                <tr class="table-secondary">
                    <th style="font-size:12px;">Username</th>
                    <th style="text-align:center; font-size:12px;">Round 1</th>
                    <th style="text-align:center; font-size:12px;">PR</th>
                    <th style="text-align:center; font-size:12px;">Bonus</th>
                    <th style="text-align:center; font-size:12px;">Round 2</th>
                    <th style="text-align:center; font-size:12px;">PR</th>
                    <th style="text-align:center; font-size:12px;">Bonus</th>
                    <th style="text-align:center; font-size:12px;">Total</th>
                    <th style="text-align:center; font-size:12px;">Rank</th>
                </tr>
                                    <tr>
                        <td class="table-light" style="text-align:center; font-size:12px;">abc123</td>
                        <td class="table-light" style="text-align:center; font-size:12px;">4</td>
                        <td class="table-warning" style="text-align:center; font-size:12px;">1</td>
                        <td class="table-warning" style="text-align:center; font-size:12px;">2</td>
                        <td class="table-warning" style="text-align:center; font-size:12px;">12</td>
                        <td class="table-secondary" style="text-align:center; font-size:12px;">1</td>
                        <td class="table-secondary" style="text-align:center; font-size:12px;">2</td>
                        <td class="table-light" style="text-align:center; font-size:12px;"><b>22</b></td>
                         <td class="table-light" style="text-align:center; font-size:12px;"><b>1</b></td>                         
                    </tr>
                </table>

Answer 1

The style attribute contains CSS code. Although this way of applying the same style to elements over and over is very impractical, you can add the "border" property to a <td> element.

Syntax is: border: weight style color. There is also other CSS properties like border-right, border-bottom etc. if you don't want to apply the border to all sides, which you don't in your question.

Examples:

border-right: 1px solid #000;
border-left: 5px dashed #313131;

Edit:

To make it more clear, you need to update the style attribute of a <td> or <th> element you want.

For example:

style="text-align:center; font-size:12px; border-right: 2px solid #333;"