Alertes
Bootstrap fournit un moyen facile de créer des messages d'alerte prédéfinis:
Les alertes sont créés avec la .alert classe, suivie par l' une des quatre classes contextuelles .alert-success , .alert-info , .alert-warning ou .alert-danger :
Exemple
<div class="alert alert-success">
<strong>Success!</strong>
Indicates a successful or positive action.
</div>
<div class="alert alert-info">
<strong>Info!</strong> Indicates a neutral informative change or action.
</div>
<div class="alert alert-warning">
<strong>Warning!</strong> Indicates a warning that might need attention.
</div>
<div class="alert alert-danger">
<strong>Danger!</strong> Indicates a dangerous or potentially negative
action.
</div>
Essayez - le vous - même » Alertes de clôture
Pour fermer le message d' alerte, ajoutez class="close" et data-dismiss="alert" à un lien ou un élément de bouton:
Exemple
<div class="alert alert-success">
<a href="#"
class="close" data-dismiss="alert" aria-label="close">×</a>
<strong>Success!</strong> Indicates a successful or positive action.
</div>
Essayez - le vous - même » Le aria-* attribut et × explication
Pour aider à améliorer l' accessibilité pour les personnes utilisant des lecteurs d'écran, vous devez inclure l' aria-label="close" attribut, lors de la création d' un bouton de fermeture.
× (×) × (×) est une entité HTML qui est l'icône préférée pour fermer les boutons, plutôt que la lettre "x" .
Alertes d'animation
Le .fade et .in cours ajoute un effet de fondu lors de la fermeture du message d' alerte:
Testez-vous avec des exercices!
Exercice 1 » Exercice 2» Exercice 3 »
Remplissez Bootstrap Alert Référence
Pour une référence complète de toutes les options d' alerte, des méthodes et des événements, rendez - vous à notre Bootstrap JS Alerte de référence .