JSFiddle - React, Tailwind, and code Playground

HTML

<p>El fondo de este párrafo será color carmesí</p>
<p class="par">El fondo de este párrafo será color granate</p>
<div class="par">Este div tendrá el fondo de color rosa</div>
<p id="parr" class="par">El fondo de este párrafo será de color verde</p>
<p id="parr" style="background: black;">El fondo de este párrafo será negro porque use un atributo de estilo dentro de la etiqueta</p>
<p id="parr">El fondo de este párrafo será rojo</p>

CSS

p{
background: crimson;//Especificidad de 1 punto
}
.par{
background: pink;//Especificidad de 10 puntos
}
p.par{
background: maroon;//Especificidad de 11 puntos
}
#parr{
background: orange;//Especificidad de 100 puntos
}
p#parr{
background: red;//Especificidad de 101 puntos
}
p.par#parr{
background:green;//Especificidad de 111 puntos
}
p{
    background:white;//agregado para comprobar la cascada vs especificidad
}