CSS-Boostrap Liaison

Sujet résolu

19 juin 2018 à 16:14:29

Bonjour,

Je crée actuellement une navbar avec bootstrap cependant, je cherche a changer la couleur de celle-ci, mon lien css fonctionne bien mais j'ai pris le CDN de boostrap et il prend le dessus sur la couleur .. Comment faire svp ?

liaison html-css :

<link rel="stylesheet" href="main.css" />

pour le moment j'ai mis le lien directement dans le même fichier pour le test mais par la suite il sera ajouté dans le dossier css déjà présent et je modifierais le lien d'accès.

css de la navbar :

.bg-light {
	background-color: red !important;
}

Besoin d'aide svp

Lamecarlate

19 juin 2018 à 16:21:31

Bonjour,

tu peux montrer le html, surtout le <head> ? Tu dois charger d'abord le CSS de Bootstrap, puis le tien.

Pas d'aide concernant le code par MP, le forum est là pour ça :)

Cyber27

19 juin 2018 à 16:25:51

Problème résolu, en fin de compte il fallait simplement que je mette mon lien css ( de mon fichier css ) en dessous de celui de boostrap

 <!--Bootstrap Css-->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
        <!--Jquery JS-->
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
        <!--Popper JS-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
        <!-- Boostrap JS-->
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
        <!--Liaison avec fichier css-->
        <link rel="stylesheet" href="css/main.css" /> ( il se situait en haut de Bootstrap Css )

-
Edité par Cyber27 19 juin 2018 à 16:28:17

Lamecarlate

19 juin 2018 à 16:38:59

Oui, c'est le fonctionnement normal de CSS : la lecture se fait de haut en bas, un fichier après l'autre, et la déclaration la plus "récente", la plus "en bas", écrase les précédentes.

Bonne continuation !

Pas d'aide concernant le code par MP, le forum est là pour ça :)

Cyber27

20 juin 2018 à 11:20:54

Merci