Les jeux de couleurs UTILITAIRES:Jeux de couleurs

Nous avons déjà de nombreuses fois utilisé les jeux de couleurs de Bootstrap. Ces couleurs s’utilisent dans des classes, la plupart du temps en tant que suffixe.

Pour associer une couleur à du texte, il faut utiliser la classe .text-couleur, où le suffixe couleur indique la couleur voulue. Pour mettre un arrière-plan en couleur, la classe à utiliser est .bg-couleur.

Voici les couleurs de Bootstrap :

  • primary : couleur bleue, #007bff.

  • secondary : couleur gris-foncée, #6c757d.

  • success : couleur verte, #28a745.

  • danger : couleur verte, #dc3545.

  • success : couleur verte, #28a745.

  • warning : couleur jaune, #ffc107.

  • info : couleur bleue-verte, #17A2B4.

  • light : couleur grise très claire, #f8f9fa.

  • dark : couleur grise foncée, #343a40.

  • white : couleur blanche, #fffff.

Voici un exemple, à télécharger dans le dossier nommé 12-Utilitaires-03, avec une couleur d’arrière-plan et pour le texte :

<div class="mb-2 bg-primary text-warning">.bg-primary</div> 
<div class="mb-2 bg-secondary text-white">.bg-secondary</div> 
<div class="mb-2 bg-success text-primary">.bg-success</div> 
<div class="mb-2 bg-danger text-light">.bg-danger</div> 
<div class="mb-2 bg-warning text-dark">.bg-warning</div> 
<div class="mb-2 bg-info text-white">.bg-info</div> 
<div class="mb-2 bg-light...
Pour consulter la suite, découvrez le livre suivant :
couv_OW24BOO.png
60-signet.svg
En version papier
20-ecran_lettre.svg
En version numérique
41-logo_abonnement.svg
En illimité avec l'abonnement ENI
130-boutique.svg
Sur la boutique officielle ENI
Précédent
Le flottement
Suivant
Changer l’affichage des éléments