Seleccionar página
mayo 6, 2019

Efecto Hover con Divi, para texto sobre imagen. Sin código

por | Divi

Hoy quiero compartir con vosotros este vídeo tutorial donde veremos como crear un efecto hover con Divi. En este tutorial no he querido utilizar código html ni CSS.

Al final de este post encontrarás un enlace para descargar este ejercicio y poder utilizarlo en tus proyectos con Divi.

He aprovechado la nueva funcionalidad que tiene una de las últimas versiones de Divi la cual nos permite cambiar estilos cuando el cursor está sobre un elemento. Si no la conoces te recomiendo que la explores porque da mucho juego y nos permite crear efectos dinamismo en nuestras web de una forma muy sencilla.

Si aún no te has hecho con Divi puedes descargar y comprar esta poderosa herramienta en el siguiente enlace. Comprar Divi

Resultado efecto hover con Divi

efecto hover con divi para texto con imagen de fondo

Vídeo Tutorial: Efecto hover para texto con imagen de fondo

 

Resumen para crear este efecto hover con Divi

  1. Crear una sección con las columnas que necesites
  2. Utilizar la opción: «igualar columnas»
  3. Asignar una imagen de fondo a cada columna
  4. Editar diseño / separación / relleno en cada uno de los módulos de texto utilizando la opción de hover.

Importante. Recuerda que el sumatorio del relleno superior e inferior deben ser los mismos en la opción «Por Defecto y Hover»

Espero que te haya gustado este tutorial.

Próximamente colgaré un nuevo tutorial de otro efecto hover con Divi más complejo, utilizando transiciones y animaciones de CSS.

Descarga esta plantilla y utilízala en tus proyectos

Anto Fernández

Anto Fernández

Mi nombre es Anto Fernández y gestiono este blog. En el puedes encontrar recursos que yo mismo he generado de tereceros acerca de diseño y maquetación web.

4 Comentarios

  1. Pascual

    Hola

    Me gusta es un efecto sencillo y muy agradable

    Responder
  2. sixto

    donde dice otros artículos que te pueden interesar tienes algún curso que explique como los realizas ese es el modulo anuncio cierto ? o con llamada ala acción

    Responder
    • Anto Fernández

      Hola Sixto. No acabo de entender tu comentario. Si te refieres a como están añadidos esos artículos están añadidos con la función propia de WordPress

      Responder

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

NO TE PIERDAS NADA

SUSCRÍBETEA MI LISTA

Recibe en tu correo los nuevos post y contenidos de mi blog.

Revisa tu correo, sólo queda que confirmes tu suscripción al blog.