Blog d'aide de Blog4ever

Blog d'aide de Blog4ever

Petites flèche menu déroulant barre navigation

1982 appréciations
Hors-ligne


J'ai cherché je n'ai pas trouvé de sujet ou alors il me faut quatres paires de loouuunneettesss...

Y a t il une possibilité de changer l'image flèche indiquant qu'il y a un menu déroulant ou si ce n'est pas possible lui donner une autre couleur ???
Quels codes doit on mettre ???
Voir ma capture :


Merci d'avance 


379 appréciations
Hors-ligne
Bonjour,

pour modifier la couleur de la flèche, il faut utiliser le code suivant :

nav .caret {
  border-top-color: ;
}


Pour s'en servir, il suffit remplacer par la couleur souhaitée.

Je t'ai ajouté le code dans ton CSS, ligne 122. J'ai mis la même couleur que les liens de ta barre de navigation mais si ça ne te convient pas, il te suffit de remplacer le code couleur par un autre.

Bonne journée.
Maelyne/Maelranaidh - Developpeuse & Graphiste Blog4ever

1982 appréciations
Hors-ligne
 "Maelyne"
Comme je te l'ai déjà dit j'adore ce prénom 

Je vais aller voir ça tout de suite
Et d'avance je te dit GRAND 

1982 appréciations
Hors-ligne
Ah bah voilà ! On la voit mieux.

J'ai essayé de mettre :
background-image: url(https://static.blog4ever.com/2013/02/727680/essai-fleche.gif);

Bon je reconnais que l'image est pas très jolie mais de toute manière cela ne fonctionne pas.

Pourquoi ?

Bonne journée

379 appréciations
Hors-ligne
Re,

Haha, merci.

Alors, mettre une image serait possible mais ça demande un certain nombre d'ajustements.

J'ai modifié ton CSS pour mettre ton image. Par contre, si jamais tu changes l'image, les ajustements risquent de devenir obsolètes (si ses dimensions sont différentes surtout).

Je te fais un petit topo sur le pourquoi du comment des règles que j'ai utilisé :

nav .caret {
  background-image: url(https://static.blog4ever.com/2013/02/727680/essai-fleche.gif);
  background-repeat: no-repeat;
  background-position: 0 0;
  width: 15px;
  height: 13px;
  border: 0 !important;
  margin: 13px 0 0 7px;
}


- background-x : gère l'url de l'image, sa façon de s'afficher et sa position. Quelque soit les dimensions de l'image, tu ne devrais pas avoir besoin d'y retoucher. Sauf l'url, bien sûr, si tu veux changer l'image.

- width/height : correspond aux dimensions largeur/hauteur (respectivement) de l'image choisie. Si tu changes l'image et que les dimensions diffèrent, il faut changer les valeurs en conséquences.

- border : ne pas toucher à cette instruction. C'est ce qui annule le style par défaut (la flèche colorée)

- margin: ça gère la position de la flèche par rapport au texte. Pareil, si les dimensions changent, il y aura des ajustements à faire. Si l'image est plus petite, il faudra ajuster la première valeur en l'augmentant. Si elle est plus grande, il faudra la réduire.

Si jamais tu veux revenir à la flèche basique, tu mets tout ça en commentaire, tu laisses juste le code que j'avais mis dans mon message initial.

Bonne journée.
Maelyne/Maelranaidh - Developpeuse & Graphiste Blog4ever

1982 appréciations
Hors-ligne

 pour toutes tes explications, cela m'aide à mieux comprendre et je pense que cela va aider beaucoup de blogueurs


Vous ne disposez pas des permissions nécessaires pour répondre à un sujet de la catégorie Petits soucis.

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 5922 autres membres