28172 sujets

CSS et mise en forme, CSS3

Couleur du menu lors du passage de la souris

Bonjour,
Je tourne en rond depuis des heures sans voir ce qui colle. Je suis débutante et je tente en vain de modifier la couleur de fond de mon menu ainsi que la couleur du texte. Le menu est à la base en fond noir et texte en blanc ; je voulais inverser avec fond blanc et texte en noir.
Ce que j'ai réussi. Or, maintenant je m’aperçois que lorsque je passe ma souris sur un item du menu, je suis en blanc sur fond blanc ce qui le rend illisible.
Je n'arrive pas à trouver ce que je dois indiquer pour corriger cela et l'avoir en noir.
Est-ce que l'un de vous peut m'aider svp?
Bonne journée,
Jessy

P.S : voici le code que j'ai mis pour pouvoir mettre les couleurs attendu dans le menu et dans le sous-menu

 .page nav.navbar.navbar-custom { 
    background: #ffffff !important;
}

.navbar-cart .glyphicon-search:before {
    color: #000000; font-size: larger;
}

.navbar-cart span.icon-basket {
    color: #000000;
}

.single-product .product_title, .shop-item-title a {
    color: #000000;
}

.navbar-custom .nav li > a {
    color: #000000; font-size: larger;
}

.navbar-custom {
    background: #ffffff !important;
}

nav.navbar.navbar-custom { 
    background: #ffffff !important;
}

.navbar-cart .glyphicon-search:before {
    color: #000000; font-size: larger;
}

.navbar-cart span.icon-basket {
    color: #000000;
}

.bottom-page-wrap .bg-dark {
    background-color: #ffffff !important;
}

.navbar-custom .sub-menu{ 
    background: #ffffff !important;
}

Modifié par jessyweb (09 Jan 2018 - 17:44)
Modérateur
Bonjour,

Il n'y a aucune ligne dans le css que tu donnes avec un :hover (qui permet de changer quelque chose au survol de la souris).

En l'état, on ne peut donc pas savoir ce qui ne va pas. Recherche déjà si quelque part tu as un :hover, et c'est là qu'il faudra faire une correction.

Amicalement,
Et regarde aussi si tu a une couleur par défaut sur tes liens.
Auquel cas il te faudra sans doute préciser que la couleur de tes liens est différente lorsqu'ils sont enfants de ta navigation.
Bonjour,

Merci pour vos pistes !
En continuant à fouiller sur le net, j'ai trouvé ça :
.navbar-custom .nav > li > a:hover, .navbar-custom .nav .open > a, .navbar-custom .nav .open > a:focus, .navbar-custom .nav .open > a:hover, .navbar-custom .sub-menu > li > a:focus, .navbar-custom .sub-menu > li > a:hover { color: rgba(8,22,22,0.54); }

Et quand je le mets dans mes paramètres css ça marche.
Je ne vous cache pas que je ne comprends pas tout ce si ce n'est le hover puisque vous m'en avez parlé.

Mais lorsque je ne prends que la partie "hover" de chaque partie, ça me laisse en fond blanc sur fond blanc le nom du menu principal alors que lorsque je prends tout, ça me change bien tout les éléments lorsque je passe la souris dessus.

Il faudrait que je prenne chaque "attribut" pour connaître sa signification...

Merci encore,
Jess
Sujet clos
Aller à