Sommaire

Les étiquettes COMPOSANTS D’INTERFACE D’ADMINISTRATION:Étiquettes

Bootstrap nous propose toute une série de classes pour mettre en évidence une sélection de mots de manière colorée.

Vous placez votre sélection dans un élément <span> avec la classe .label. Pour ajouter une couleur, utilisez ces classes :

  • label-default : fond gris.

  • label-primary : fond bleu.

  • label-succes : fond vert.

  • label-info : fond cyan.

  • label-warning : fond orange.

  • label-danger : fond rouge.

Voici les exemples de code HTML à utiliser :

<p>Cras justo odio, dapibus ac <span class="label label-default">
facilisis in</span> egestas eget quam.</p> 
<p>Cras justo odio, dapibus ac <span class="label label-primary">
facilisis in</span> egestas eget quam.</p> 
<p>Cras justo odio, dapibus ac <span class="label label-success">
facilisis in</span> egestas eget quam.</p> 
<p>Cras justo odio, dapibus ac <span class="label label-info">
facilisis in</span> egestas eget quam.</p> 
<p>Cras justo odio, dapibus ac <span class="label label-warning">
facilisis in</span> egestas eget quam.</p> 
<p>Cras justo odio, dapibus ac <span class="label label-danger">
facilisis in</span> egestas eget quam.</p>

Voici l’affichage obtenu :

images/C13-004.png

Voici les sélecteurs CSS qui interviennent dans ces étiquettes ...