Formato de texto en CSS

El formato de texto en CSS permite personalizar la apariencia de los textos: color, tamaño, alineación, espaciado entre letras, decoraciones e interlineado. Estas configuraciones son clave para la legibilidad y la experiencia visual.

Propiedades básicas de formato de texto

Se pueden definir color, tamaño de fuente y alineación. Estas propiedades determinan la primera impresión visual del texto.

En el siguiente ejemplo, el párrafo tiene color azul oscuro, tamaño de fuente de 18px y está centrado:

Alineación de texto

Con la propiedad <text-align> se puede alinear el texto a la izquierda, derecha, centro o justificado.

Transformación y decoración del texto

Con <text-transform> se puede convertir el texto en mayúsculas, minúsculas o capitalizarlo. Con <text-decoration> se puede subrayar o tachar, y con <letter-spacing> controlar el espaciado entre letras.

En el siguiente ejemplo, el texto aparece en mayúsculas, subrayado y con espaciado extra entre letras:

Interlineado y espaciado de palabras

La propiedad <line-height> controla la distancia entre líneas, mientras que <word-spacing> ajusta el espacio entre palabras. Ambas son útiles para mejorar la legibilidad.

En el siguiente ejemplo, el texto tiene un interlineado de 1.8 y un espaciado entre palabras de 5px:

Sombra de texto (text-shadow)

Con <text-shadow> se pueden añadir sombras al texto para resaltarlo o decorarlo.

Configuraciones tipográficas avanzadas

Con las propiedades <white-space> y <word-break> se controla cuándo se parte el texto en una nueva línea y cómo se manejan las palabras largas.

Consejos para formatear texto

Estos consejos ayudan a mantener el texto legible y estético:

• Asegura un buen contraste entre el texto y el fondo.
• Evita usar demasiadas decoraciones, ya que pueden distraer.
• Usa un interlineado adecuado para que el texto sea legible en distintos dispositivos.