avvisi
Bootstrap fornisce un modo semplice per creare messaggi di avviso predefiniti:
Gli avvisi vengono creati con l' .alert di classe, seguito da una delle quattro classi contestuali .alert-success , .alert-info , .alert-warning o .alert-danger :
Esempio
<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>
Prova tu stesso " Avvisi di chiusura
Per chiudere il messaggio di avviso, aggiungere class="close" e data-dismiss="alert" ad un link o un elemento tasto:
Esempio
<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>
Prova tu stesso " Il aria-* attributi e × spiegazione
Per contribuire a migliorare l'accessibilità per le persone che utilizzano screen reader, è necessario includere l' aria-label="close" attributo, durante la creazione di un pulsante di chiusura.
× (×) × (×) è un'entità HTML che è l'icona preferito per pulsanti di chiusura, piuttosto che la lettera "x" .
Avvisi animati
Il .fade e .in classi aggiunge un effetto di dissolvenza quando si chiude il messaggio di avviso:
Mettiti alla prova con esercizi!
Esercizio 1 » Esercizio 2» Esercizio 3 »
Completare Bootstrap Alert di riferimento
Per un riferimento completo di tutte le opzioni di avviso, i metodi e gli eventi, vai alla nostra Bootstrap JS Avviso di riferimento .