Nav bar bootstrap couleur

Par Isselmoumg, il y a 10 ans

Les bases HTML/CSS

Bonjour,
J'ai pu integrer bootstrap à mon site et j'ai pu même afficher le bar de navigation, mais j'ai rencontré un petit problème, je n'ai pas pu modifier la couleur par defaut du bar.
en effet, j'ai essayé de donner à la class nav

background-color: #22aaff;

mais la couleur par defaut persiste.
je n'ai pas pu également fonctionner le click sur les diffetns items du menu, auterment dis lorsque je clique sur un item , la class active reste toujours attribuée à Home. j'ai telechargé le fichier less.js et jquery.min.js mais rien ne marche pas.
merci de me pousser.

13 réponses

Lartak, il y a 10 ans

Bonjour.

en effet, j'ai essayé de donner à la class nav

Est-ce que tu as bien modifié la bonne classe et charges-tu bien le bon fichier CSS ?

je n'ai pas pu également fonctionner le click sur les diffetns items du menu, auterment dis lorsque je clique sur un item , la class active reste toujours attribuée à Home.

C'est normal, la classe active ne s'attribut pas par défaut à l'élément cliqué, il te faut le faire par exemple via PHP en ajoutant la classe sur l'élément correspondant à la page active ou via javascript avec une comparaison entre l'url et l'attribut href des éléments du menu.

JMERISE, il y a 10 ans

Bonsoir,
Essaye de mettre d'abore de lien du style de bootstrap avant la feuille de style de t-on site.

Isselmoumg, il y a 10 ans

Merci à Tous,
Mr Mikayil, j'ai mis les liens de styles de bootstrap avant le mien.

Lartak, il y a 10 ans

j'ai mis les liens de styles de bootstrap avant le mien.

Et donc ?
Problem resolved or not ?

Isselmoumg, il y a 10 ans

Non Pas encore,
et pour Mr Xen0risDEV, il m'a donné un lien tres utile, mais je n'ai pas pu integrer son code à ma page web.

Grafikart, il y a 10 ans

Utilise l'inspecteur de chrome il te montre les règle appliquées, et l'ordre de priorité utilisé. Au pire du pire rajoute un !important

Isselmoumg, il y a 10 ans

Bonjour,
le problème n'est pas encore resolu, en effet, je sais pas est ce que pour pouvoir changer la couleur ou changer le lien active, est ce que j'aurai besoin d'utiliser un code de jquery ou ça devra etre automatique apres avoir inclut les fichiers bootstrap.js et jquery.js ? ou non

Isselmoumg, il y a 10 ans

J'ai pu changer le lien active grace au code suivant :

$('.nav > li').on('click', function(e) { $('.nav > li').removeClass('active'); $(this).addClass('active'); });

mais jusqu'à maintenant je n'ai pas pu jouer sur la couleur intiale du nav bar.

JMERISE, il y a 10 ans

Salut essaye ca :

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{ background-color: #000; }
Xen0risDEV, il y a 10 ans

Bonjour, en ayant votre feuille de style personnalisé. :)

Isselmoumg, il y a 10 ans

Merci encore à tous,
et merci à Mr Xen0risDEV, merci beaucoup pour le cadeau, mais comment puis je modifier le bootstrap.css pour prendre en consideration le style apparu au niveau
http://work.smarchal.com/twbscolor/
?

JMERISE, il y a 10 ans

Si le prôbléme et résolue, merci de mettre le post en résolue.