JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr class="border1">
    <td>1</td>
    <td>2</td>
    <td>3</td>
</tr>
<tr class="border2">
    <td>a</td>
    <td>b</td>
    <td>c</td>
</tr>
<tr class="border3">
    <td>4</td>
    <td>5</td>
    <td>6</td>
</tr>
</table>

<div style="height:20px;"></div>
<div style="width:50%;border-top:1px dotted blue;">
    The border should look like the blue border.
</div>

CSS

table {
    width: 50%;
}

table td {
border-top:1px dotted blue        
}