Hemos creado tres cards, las cuales tiene cada una una imagen y textos, a las cuales les he aplicado unas transformaciones y transiciones utilizando CSS3.
Este ejemplo lo hemos realizado con CSS3 y Html5, sin utilizar ninguna lenguaje de programación.
En un principio tenemos tres imagenes que se encuentran cada una en una Card, las cuales para posicionarlas, hemos utilizado Flexbox.
Cada card posee unos textos, los cuales se encuentran ocultos, pero al pasar con el ratón por cada card, lo muestra con un fondo.
En esta Primera Card, vemos como los textos salen desde abajo, por supuesto hemos utilizado un transform que lo desplaza desde abajo y por supuesto para que la transformación no se vea de golpe he utilizado una transition.
En esta Segunda Card, vemos como los textos salen del centro de la card, y desaparecen igual, por supuesto hemos utilizado un transform tipo scale y por supuesto para que la transformación no se vea de golpe he utilizado una transition.
En esta Tercera Card, vemos como los textos salen desde un lado, y desaparecen igual, por supuesto hemos utilizado un transform tipo traslate y por supuesto para que la transformación no se vea de golpe he utilizado una transition.
© 2025 Mariano Garrido - Todos los derechos reservados