Viendo alertas
¡Peligro!
Rojo indica a menudo una acción peligrosa o potencialmente negativo.
¡Advertencia!
Amarillo y naranja a menudo indica una advertencia de que puede ser que necesite atención.
¡Éxito!
Verde indica a menudo una acción exitosa o positivo.
Info!
Azul a menudo indica un cambio informativo neutral o acción.
Un cuadro de alerta es sólo un w3-contenedor con un color:
Ejemplo
<div class="w3-container w3-red">
<h3>Danger!</h3>
<p>Red often
indicates a dangerous or potentially negative action.</p>
</div> Inténtalo tú mismo " W3.CSS Colores
Alertas a menudo se muestran con un color fuerte, pero cualquier color se pueden utilizar:
¡Peligro!
Rojo indica a menudo una acción peligrosa o potencialmente negativo.
¡Advertencia!
Amarillo indica a menudo una advertencia de que puede ser que necesite atención.
¡Éxito!
Verde indica a menudo algo de éxito o positivo.
¡Peligro!
¡Advertencia!
¡Éxito!
alertas de cierre
Para cerrar estos contenedores, haga clic en la X en la esquina superior derecha:
¡Peligro!
Rojo indica a menudo una acción peligrosa o potencialmente negativo.
¡Advertencia!
Amarillo indica a menudo una advertencia de que puede ser que necesite atención.
¡Éxito!
Verde indica a menudo una acción exitosa o positivo.
Cierre de una alerta se puede hacer usando un evento onclick en un w3-closebtn:
Ejemplo
<span onclick="this.parentElement.style.display='none'"
class="w3-closebtn">×</span> Inténtalo tú mismo " alertas redondeadas
Utilice las clases w3 ronda si desea esquinas redondeadas:
W3 ronda
W3-redonda de gran
W3-ronda-Xxlarge
Alerta como una tarjeta
W3-card-8