JSFiddle - React, Tailwind, and code Playground

HTML

<span class="complete-sentence">She <span class="verb adverb">loves</span> him a <span>lot</span>.</span>

<g>complete-sentence|She <g>verb adverb|loves</g> him a <g>lot</g></g>

CSS

g { display:inline-block; color:red; line-height:20px; }

span{
    text-align:center;
    display:inline-block;
      border:1px solid black;
    border-radius:15px;
    padding:2px;
}

span[class]:before {
    width:100%;
    text-align:center;
    float:right;
    font:bold 10px arial;
    color:#00f;
    content: attr(class) "";
}