+41789553005
Sabemos que una de las mejores cosas para aquellos que se encargan de crear o mantener su  sitio web, es personalizar y destacar elementos del mismo. Es por ello que te enseñaremos a crear Flip cards con animación CSS3, de forma sencilla y efectiva Como ya hemos mencionado anteriormente, esto es muy sencillo de hacer y para simplificar aún más las cosas, acá te damos la oportunidad de descargar en un archivo las tres secciones que utilizamos en este tutorial.
Nota: Este tutorial es gracias al artículo de davidwalsh

¡Comencemos ahora!

El primer paso es agregar una sección y luego agregar una o más columnas con un módulo de código.
barra de promocion Divi
Para personalizar el código te mostraremos como puedes proceder solo teniendo que cambiar el icono de la etiqueta y cambiar el texto del título y párrafos y agregar un link al botón
barra de promocion Divi
A continuación 3 ejemplos de Flip cards utilizando el código CSS que deberás agregar al panel de opciones de Divi o tema hijo de Divi

Agregar JQuery

Código:

Agrega este Script en panel de opciones, para ello dirígete a la pestaña integraciones> Agregar código al <head> de su blog

Ahora los 3 ejemplos de Flip card

1. Flip Card Horizontal

Esta cuenta con animación horizontal que muestra la parte posterior de la tarjeta.
Código:
barra de promocion Divi

2. Flip Card Vertical

Igual al anterior variando la dirección la cual es de modo vertical.
Código:
barra de promocion Divi

3. Flip Card con imagen de fondo

Puedes personalizarlo a tu gusto, en este caso, agregar una imagen de fondo en la sección frontal con un gradiente lineal para crear un efecto de superposición y resaltar el texto.
Código:
barra de promocion Divi
Esto es todo!. Si deseas conocer más acerca de divi puedes encontrar información que te interese en nuestra sección Documentación de Divi en español