À propos de l'élément Liste d'éléments
Le Liste d'articles L'élément <link> de GemPages vous permet d'afficher une liste d'éléments avec des icônes et du texte, ce qui est utile pour mettre en valeur les avantages des produits, les politiques du magasin, les fonctionnalités du service, etc.
Si vous découvrez cet élément, vous trouverez plus d'informations dans notre guide. ici.
Par défaut, le texte d'une liste d'éléments conserve généralement la même couleur, même lorsque les utilisateurs le survolent. Pour créer un effet plus interactif ou mettre en valeur un contenu important, vous pouvez appliquer une couleur personnalisée au survol grâce au CSS.
Comment modifier la couleur du texte d'une liste d'éléments au survol ?
Étape 1 : Ouvrez le panneau Code personnalisé de l’élément Liste d’éléments
Dans l'éditeur GemPages, repérez le Liste d'articles élément que vous souhaitez personnaliser.
Puis, cliquez avec le bouton droit sur l'élément Liste d'éléments et sélectionnez Code personnalisé.
Étape 2 : Ajouter le code CSS de survol
Collez le code CSS suivant dans la zone Code personnalisé :
.gXogrronUE .gp-icon-list-text:hover { couleur : #FF3126 ; }
Étape 3 : Remplacez la classe de l’élément par votre propre classe.
Dans le code ci-dessus, .gXogrronUE est le sélecteur de classe de l'élément spécifique de la liste d'éléments.
Vous devez la remplacer par la classe réelle de votre propre élément de liste d'éléments.
Le code final doit donc suivre cette structure :
.votre-classe-élément .gp-icon-list-text:hover { couleur : #FF3126 ; }
- remplacer votre-classe-élément avec la classe de votre élément Liste d'éléments.
- remplacer # FF3126 avec le code couleur de votre choix pour l'état de survol.
Vous pouvez utiliser des outils de sélection de couleurs gratuits pour trouver un code couleur, par exemple :
Merci pour vos commentaires