🚀 Objetivo de la Práctica
Explorar las capacidades de CSS3 para crear interfaces dinámicas mediante el uso de @keyframes, transiciones de estado y la función de temporización steps().
Desglose de los Ejercicios
1. Animación Compleja (Shorthand)
Implementación de una letra 'p' que recorre la pantalla de extremo a extremo, escalando su tamaño y variando su color. Se ha utilizado la propiedad abreviada para optimizar el código:
animation: moverLetra 4s linear 1s 2 alternate forwards;
2. Transiciones Dinámicas (Hover)
Transformación de enlaces mediante transition. Al pasar el cursor, el elemento se escala al 200%, rota 180° y cambia de color con una aceleración lineal.
3. Temporización con Steps()
Creación de un círculo con border-radius: 50%. La diferencia clave radica en el uso de steps(4), lo que fragmenta la transición de color en 4 saltos discretos en lugar de un degradado fluido.