ALERTS
Este tipo de mensajes se utilizan normalmente para proporcionar al usuario información contextual
sobre el resultado de sus acciones.
Ejemplo
Para mostrar un mensaje de alerta, encierra dentro de un elemento con la clase .alert tanto el texto del mensaje como el botón opcional para ocultar la alerta.
Además de esta clase base, también debes aplicar cualquiera de las otras cuatro clases .alert-* para indicar explícitamente el tipo de mensaje (advertencia, error, éxito, información).
<div class="alert alert-success">...</div> <div class="alert alert-info">...</div> <div class="alert alert-warning">...</div> <div class="alert alert-danger">...</div>
Resultado
Cerrando los mensajes de alerta
Opcionalmente los mensajes de alerta pueden mostrar un botón de cierre para ocultar la alerta. Para que funcione este comportamiento, es necesario incluir el plugin alerts de JavaScript. Ejemplo:
<div class="alert alert-warning alert-dismissable"> <button type="button" class="close" data-dismiss="alert">×</button> <strong>¡Cuidado!</strong> Es muy importante que leas este mensaje de alerta. </div>
Resultado
Añadiendo Enlaces a las Alertas
Si el mensaje de la alerta contiene enlaces, resulta conveniente aplicarles la clase
.alert-link para que su aspecto se adapte al del resto del mensaje. Ejemplo:
<div class="alert alert-success"> <a href="#" class="alert-link">...</a> </div> <div class="alert alert-info"> <a href="#" class="alert-link">...</a> </div> <div class="alert alert-warning"> <a href="#" class="alert-link">...</a> </div> <div class="alert alert-danger"> <a href="#" class="alert-link">...</a> </div>