JSFiddle - React, Tailwind, and code Playground

HTML

<h3 id="uno">Título<h3>
    
<h3 id="dos">Título<h3>
        
<h3 id="tres">Título<h3>
            
<h3 id="cuatro">Título<h3>

<p class="primero">
hola yo soy un parrafo normal al <span>que le van a hacer</span> una seria de pruebas para ver que tal se me da esto del html, aunque yo creo que se me da bastante bien...
</p>

<p class="segundo">
hola,yo soy otro párrafo al que también se le van a hacer unas cuantas pruebas a ver que tal se me da la cosa... <span>en fin, vamos allá!</span>
</p>

CSS

#uno {
    text-decoration: underline;
    text-align: center;
   
}

#dos {
    text-decoration: line-through;
    text-align: left
}

#tres {
    text-decoration: overline;
    text-align: right
}

#cuatro {
    text-decoration: none;
}
.primero{
  font-family: josefin sans;
  color: pink;
  text-align: center;
  background-color: grey;
  font-size: 20px;
}
.segundo{
  font-family: josefin sans;
  color: grey;
  text-align: center;
  background-color: pink;
  font-size: 20px;
}
span{
  font-style: italic;
}