Curso de CSS
Dale estilo y vida a la web.
Aprende CSS con ejemplos interactivos y crea proyectos reales.
text-align, text-decoration y text-transform terminan de dar forma a cómo se presenta el texto en pantalla.
Explicación
Estas propiedades terminan de definir la presentación del texto:
text-alignAlinea el texto horizontalmente: left, center, right o justify.
text-transformCambia mayúsculas/minúsculas visualmente sin tocar el texto real del HTML: uppercase, lowercase, capitalize.
text-decorationAgrega o quita líneas del texto: underline, line-through o none.
Reto rápido
Cambia text-transform del h2 por lowercase o capitalize y observa la diferencia.
En esta lección
- Ejemplo interactivo
- Explicación de cada etiqueta
- Cuándo usarlo
- Errores comunes
Consejo
Usa text-transform: uppercase en vez de escribir el texto en mayúsculas en el HTML: mantienes el contenido real accesible y fácil de leer.
Dato extra
text-decoration: none es la propiedad clásica para quitarle el subrayado por defecto a los enlaces (<a>) en un diseño personalizado.
Error común
Usar text-align: center esperando centrar un elemento completo (como una caja): text-align solo centra el texto/contenido en línea dentro de su contenedor, no el contenedor en sí.
Siguiente paso
El texto ya está bajo control. Ahora vamos a la base de todo diseño en CSS: el modelo de caja.
Ir a la siguiente lección