Pas de couleur dans les bar progress
Résolu
Diego987
Messages postés
64
Date d'inscription
Statut
Membre
Dernière intervention
-
Diego987 Messages postés 64 Date d'inscription Statut Membre Dernière intervention -
Diego987 Messages postés 64 Date d'inscription Statut Membre Dernière intervention -
Bonjour, toujours dans un tuto sur Bootstrap, je n'arrive pas à avoir les couleurs dans les progress-bar. Auriez-vous une idée de pourquoi? Merci
code:
Code :
j'ai ça :
et non :
Merci
code:
Code :
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=devise-width, initial-scale=1">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" ></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container" style="margin-top: 50px;">
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" style="width: 30%">30%</div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" style="width: 40%">40%</div>
</div>
<div class="progress">
<div class="progress-bar progerss-bar-warning" role="progressbar" style="width: 60%">60%</div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-danger progress-bar-striped active" role="progressbar" style="width: 80%">80%</div>
</div>
</div>
</body>
</html>
j'ai ça :
et non :
Merci
Configuration: Macintosh / Chrome 81.0.4044.129
A voir également:
- Pas de couleur dans les bar progress
- Excel cellule couleur si condition texte - Guide
- Boite a couleur - Télécharger - Divers Photo & Graphisme
- Battery bar - Télécharger - Informations & Diagnostic
- A quoi servent les boutons de couleur sur une telecommande - Guide
- Somme si couleur - Guide
4 réponses
Je ne sais pas où tu trouves tes tutos...
mais ce n'est pas les bonnes classes utilisées
https://www.w3schools.com/bootstrap4/bootstrap_progressbars.asp
pour "info" par exemple, il faut utiliser :bg-info
mais ce n'est pas les bonnes classes utilisées
https://www.w3schools.com/bootstrap4/bootstrap_progressbars.asp
pour "info" par exemple, il faut utiliser :bg-info
<div class="progress">
<div class="progress-bar bg-info progress-bar-striped" role="progressbar" style="width: 40%">40%</div>
</div>
Salut,
sans voir le CSS impossible de dire quoi que ce soit...
C'est quoi l'intérêt de passer par un cours payant avec des
"
Cours donnés par des formateurs confirmés
Trouvez le formateur qui vous correspond
"
Si vous devez passer par un forum d'entraide pour avoir des réponses à vos exercices?
Vous aurez les mêmes services dans des cours gratuit. Comme pour tout les cours payant ou gratuit c'est surtout le travail personnel qui compte.
Je voit que votre leçon parle de bootstrap.
Pensez à développer vos connaissances (et pratiquer) si ce n'est pas assez fait :
_CSS car boostrap utilise le CSS
_JavaScript car Bootstrap s'appuie sur une bibliothèque de fonctions JavaScript(JQuery)
_HTML bien évidemment car HTML si vous avez des lacunes sur les balises à utiliser, les rôles de chaque élément, la syntaxe et les attributs à utiliser et dans quels cas. CSS s'appliquant au HTML et JavaScript permet de manipuler HTML c'est essentiel.
Bon travail, prendre du recul pour voir par une autre leçon sur le même sujet ou un autre thème est une bonne méthode pour avancer quand on est bloqué.
Par exemple le plus ismple quand on a un doute c'est d regarder le manuel:
https://getbootstrap.com/docs/4.0/components/progress/
Ah ben tiens donc! la leçon qu'on vous a proposé est exactement de réaliser l'exemple du manuel à appliquer...
Autant commencer par le manuel la prochaine fois ;)
sans voir le CSS impossible de dire quoi que ce soit...
C'est quoi l'intérêt de passer par un cours payant avec des
"
Cours donnés par des formateurs confirmés
Trouvez le formateur qui vous correspond
"
Si vous devez passer par un forum d'entraide pour avoir des réponses à vos exercices?
Vous aurez les mêmes services dans des cours gratuit. Comme pour tout les cours payant ou gratuit c'est surtout le travail personnel qui compte.
Je voit que votre leçon parle de bootstrap.
Pensez à développer vos connaissances (et pratiquer) si ce n'est pas assez fait :
_CSS car boostrap utilise le CSS
_JavaScript car Bootstrap s'appuie sur une bibliothèque de fonctions JavaScript(JQuery)
_HTML bien évidemment car HTML si vous avez des lacunes sur les balises à utiliser, les rôles de chaque élément, la syntaxe et les attributs à utiliser et dans quels cas. CSS s'appliquant au HTML et JavaScript permet de manipuler HTML c'est essentiel.
Bon travail, prendre du recul pour voir par une autre leçon sur le même sujet ou un autre thème est une bonne méthode pour avancer quand on est bloqué.
Par exemple le plus ismple quand on a un doute c'est d regarder le manuel:
https://getbootstrap.com/docs/4.0/components/progress/
Ah ben tiens donc! la leçon qu'on vous a proposé est exactement de réaliser l'exemple du manuel à appliquer...
Autant commencer par le manuel la prochaine fois ;)
