Alertas

Ejemplos básicos


<div class="alert alert-success" role="alert">Soy una alerta de Éxito! Aparezco cuando se ha ejecutado una acción satisfactoriamente.</div>
<div class="alert alert-danger" role="alert">Soy una alerta de Error o Peligro! Aparezco cuando una acción no se ha ejecutado o cuando ha ocurrido un error.</div>
<div class="alert alert-warning" role="alert">Soy una alerta de Advertencia! Aparezco para avisar al usuario de un mensaje importante antes de hacer una acción.</div>
<div class="alert alert-info" role="alert">Soy una alerta de Información! Aparezco para proporcionar al usuario de información útil.</div>

<div class="alert alert-{primary, secondary ...}" role="alert">...</div>

Con contenido adicional


<div class="alert alert-success" role="alert">
<h4 class="alert-heading">Enhorabuena!</h4>
<p>Perfecto, haz leído con éxito esta alerta. Este texto es un poco mas largo, para que puedas ver como se ajusta el contenido del componente a su contenedor.</p>
<hr>
<p class="mb-0">Siempre que lo necesite, usa las utilidades de margen para mantener las cosas ordenadas.</p>
</div>

Descartable


<div class="alert alert-success alert-dismissible fade show" role="alert">
<strong>Perfecto!</strong> Lo haz logrado a la primera.
<button type="button" class="btn btn-white btn-icon close" data-dismiss="alert" aria-label="Close">
<span class="icon-close text-success" aria-hidden="true"></span>
</button>
</div>

Uso en formularios

Únete a Bkool. Experiencias infinitas

Por favor, inserta tu nombre
Por favor, inserta tu apellido
Por favor, inserta un email
Por favor, inserta una contraseña
Las contraseñas no coinciden

¿Ya tienes una cuenta en Bkool? Inicia sesión

Únete a Bkool. Experiencias infinitas

Acciones y eventos

Mensajes
Conexión
Status