JSFiddle - React, Tailwind, and code Playground

HTML

<img href="https://www.gravatar.com/avatar/db105120604b6ebf6780016eacf6187c?s=80">
<h1> Heading 1 </h1>
<h2> Heading 2 </h2>
<h3> Heading 3 </h3>
<h4> Heading 4 </h4>
<h5> Heading 5 </h5>
<h6> Heading 6 </h6>
<p> Paragraph </p>
<address> Address </address>
<article> Article </article>
<aside> Aside </aside>
<hr>
<b> Bold </b>
<small> Small </small>
<big> Big </big>
<span> Span </span>
<em> Em </em>
<strong> Strong </strong>
<a href="#"> Anchor </a>
<hr>

    
 <button><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements" class="block"> List of block level elements</a></button>
    
 <button><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elemente" class="block"> List of inline elements</a></button>

CSS

span, b, big, small, em, strong, a {
    border: 2px solid blue;
}


p, h1, h2, h3, h4, h5, h6, address, article, aside, hr, img {
   border: 2px solid green; 
}

.block {
    text-decoration: none;
    border: none;
}