Sobre o elemento Lista de Itens
O Lista de itens O elemento `<li>` do GemPages permite exibir uma lista de itens com ícones e texto, o que é útil para destacar os benefícios do produto, as políticas da loja, os recursos do serviço e muito mais.
Se você é novo nesse elemento, pode aprender mais em nosso guia. aqui..
Por padrão, o texto em uma Lista de Itens geralmente mantém a mesma cor, mesmo quando os clientes passam o cursor sobre ele. Se você quiser criar um efeito mais interativo ou destacar conteúdo importante, pode aplicar uma cor personalizada ao passar o cursor usando CSS.
Como alterar a cor do texto da lista de itens ao passar o cursor sobre eles
Passo 1: Abra o painel Código Personalizado do elemento Lista de Itens
No editor GemPages, localize o Lista de itens elemento que você deseja personalizar.
Em seguida, Clique com o botão direito do mouse no elemento Lista de Itens. e selecione Código personalizado.
Passo 2: Adicione o código CSS de sobreposição (hover)
Cole o seguinte código CSS na caixa Código Personalizado:
.gXogrronUE .gp-icon-list-text:hover { cor: # FF3126; }
Passo 3: Substitua a classe do elemento pela sua própria classe.
No código acima, .gXogrronUE é o seletor de classe do elemento específico da Lista de Itens.
Você precisa substituí-lo pela classe real do seu elemento da Lista de Itens.
Portanto, o código final deve seguir esta estrutura:
.your-element-class .gp-icon-list-text:hover { cor: # FF3126; }
- Substituir sua-classe-de-elemento com a classe do seu elemento da Lista de Itens.
- Substituir # FF3126 com qualquer código de cores que você queira usar para o estado de foco.
Você pode usar ferramentas gratuitas de seleção de cores para encontrar um código de cor, por exemplo:
Obrigado por seus comentários