Tipografía
Utilidades para controlar la decoración del texto.
| Clase | Estilos |
|---|---|
underline | text-decoration-line: underline; |
overline | text-decoration-line: overline; |
line-through | text-decoration-line: line-through; |
no-underline | text-decoration-line: none; |
Usa la utilidad underline para añadir un subrayado al texto de un elemento:
El veloz zorro marrón salta sobre el perro perezoso.
<p class="underline">El veloz zorro marrón...</p>Usa la utilidad overline para añadir un sobrelineado al texto de un elemento:
El veloz zorro marrón salta sobre el perro perezoso.
<p class="overline">El veloz zorro marrón...</p>Usa la utilidad line-through para tachar (línea a través) el texto de un elemento:
El veloz zorro marrón salta sobre el perro perezoso.
<p class="line-through">El veloz zorro marrón...</p>Usa la utilidad no-underline para quitar la decoración de texto de un elemento:
El veloz zorro marrón salta sobre el perro perezoso.
<p class="no-underline">El veloz zorro marrón...</p>Antepone a la utilidad text-decoration-line el prefijo de una variante como hover:* para aplicar la utilidad únicamente en ese estado:
Pasa el cursor sobre el texto para ver el comportamiento esperado
<p>El <a href="..." class="no-underline hover:underline ...">veloz zorro marrón</a> salta sobre el perro perezoso.</p>Obtén más información sobre el uso de variantes en la documentación de variantes.
Antepone a la utilidad text-decoration-line el prefijo de una variante de punto de ruptura como md: para aplicar la utilidad únicamente en tamaños de pantalla mediano y superiores:
<a class="no-underline md:underline ..." href="..."> <!-- ... --></a>Obtén más información sobre el uso de variantes en la documentación de variantes.