JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#">underline</a>
<br>
<a class="dotted-1" href="#">dotted</a>
<br>
<a class="dotted-2" href="#">dotted пример из статьи</a>
<br>
<a class="dotted-2" href="#">пример из стать<br>в две строки</a>

CSS

.dotted-1 {
    text-decoration: none;
    border-bottom: 1px dotted;
}

.dotted-2 {
    border-bottom: 1px dotted;
    text-decoration: none;
    display: inline-block;
    height: 1em;
    line-height: 1.05em;
}