Acerca del elemento Lista de ítem
El Lista de ítem de GemPages le permite mostrar una lista de elementos con iconos y texto, algo útil para destacar los beneficios de un producto, las políticas de la tienda, las características de un servicio y mucho más.
Si es la primera vez que utiliza este elemento, puede obtener más información en nuestra guía su documentación.
De forma predeterminada, el texto de una Lista de ítem suele mantener el mismo color, incluso cuando los clientes pasan el cursor por encima. Si desea crear un efecto más interactivo o hacer que un contenido importante destaque, puede aplicar un color personalizado al pasar el cursor mediante CSS.
Cómo cambiar el color del texto de la Lista de ítem al pasar el cursor
Paso 1: Abra el panel de Código personalizado del elemento Lista de ítem
En el editor de GemPages, localice el elemento Lista de ítem que desea personalizar.
A continuación, haga clic derecho sobre el elemento Lista de ítem y seleccione Código Personalizado.
Paso 2: Añada el código CSS para el estado "al pasar el cursor" (hover)
Pegue el siguiente código CSS en el cuadro de Código personalizado:
.gXogrronUE .gp-icon-list-text:hover { color: #FF3126; }
Paso 3: Reemplace la clase del elemento por la suya propia
En el código anterior, .gXogrronUE es el selector de clase del elemento Lista de ítem específico.
Debe reemplazarlo por la clase real de su propio elemento Lista de ítem.
Así, el código final debe seguir esta estructura:
.su-clase-de-elemento .gp-icon-list-text:hover { color: #FF3126; }
- Reemplace su-clase-de-elemento por la clase de su elemento Lista de ítem.
- Reemplace # FF3126 por cualquier código de color que desee utilizar para el estado al pasar el cursor.
Puede utilizar herramientas gratuitas de selección de color para encontrar un código de color, por ejemplo:
gracias por tus comentarios