Ejercicio de programación con TailwindCSS: Transiciones y animaciones de Tailwind CSS

Código
Práctica
0h 20m

Aprende a aplicar transiciones y animaciones en Tailwind CSS 3.4.10 con clases de utilidad. Ejercicio práctico para mejorar tus habilidades en diseño web.

Crea un archivo HTML con CDN que incluya un botón con las siguientes características utilizando Tailwind CSS:

  1. El botón debe tener una clase de transición que afecte a todas las propiedades.
  2. La transición debe tener una duración de 500ms.
  3. La transición debe comenzar y terminar lentamente, acelerando en el medio.
  4. Al pasar el ratón sobre el botón, el botón debe escalar al 110% de su tamaño original.
  5. Al pasar el ratón sobre el botón, el color de fondo del botón debe cambiar de azul a rojo.
Empezar ejercicio de programación

Todos los ejercicios de programación de TailwindCSS

Evalúa tus conocimientos con ejercicios de programación en TailwindCSS de tipo Test, Puzzle, Código y Proyecto con VSCode.

Tutorial para resolver este ejercicio de programación

Tailwind CSS

TailwindCSS

Transiciones y animaciones de Tailwind CSS

Clases de utilidad

Otros tutoriales de programación con TailwindCSS