Benachrichtigungen
Bootstrap bietet eine einfache Möglichkeit , vordefinierte Alarmmeldungen zu erstellen:
Alarme werden mit dem erstellten .alert
Klasse, gefolgt von einem der vier Kontextklassen .alert-success
, .alert-info
, .alert-warning
oder .alert-danger
:
Beispiel
<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>
Versuch es selber " Schluss Alerts
Um die Warnmeldung zu schließen, fügen Sie class="close"
und data-dismiss="alert"
auf einen Link oder ein Button - Element:
Beispiel
<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>
Versuch es selber " Das aria-* Attribut und × Erläuterung
Zur Verbesserung der Zugänglichkeit für Menschen Bildschirmlesegeräte verwenden, sollten Sie die gehören aria-label="close" Attribut, wenn eine Schaltfläche zum Schließen zu schaffen.
× (×) × (×) ist ein HTML - Entität , die das bevorzugte Symbol für Schließen - Button, anstatt den Buchstaben "x" .
Animierte Alerts
Die .fade
und .in
Klassen fügt einen Fading - Effekt , wenn die Warnmeldung endet:
Testen Sie sich mit Übungen!
Füllen Sie Bootstrap Warnungsreferenz
Eine vollständige Referenz aller Warnoptionen, Methoden und Ereignisse finden Sie auf unserer Bootstrap JS Alert - Referenz .