[CSS + HTML] Mensajes de alerta
¡Hola amigos! En este post les voy a enseñar a añadir los siguientes
mensajes de alerta a su página. Es muy simple y rápido así que espero que les sirva y puedan entender. Ya saben que en caso de problemas, no duden en preguntarme.
VISTA PREVIA
CÓDIGO CSS
Copiar y pegar el siguiente código entre las etiquetas
<style> en algunos de los boxes que se encuentran en la configuración avanzada de los 'Ajustes de Diseño'. Si usted usa el diseño "CSS-Design" que ofrece el servicio, el código debe pegarlo en "CSS-Design sin Style Tags" ubicado también en la configuración avanzada de 'Ajustes de Diseño'.
Cita: div.box {
border-radius: 6px 6px 6px 6px;
font-size: 14px;
margin: 2px 0 15px;
padding: 20px 15px 20px 65px;
}
div.success-box {
background: url("http://img.webme.com/pic/d/design-adri/check.png") no-repeat scroll 15px center #EBFAB6;
border: 1px solid #BBCC5B;
color: #599847;
}
div.arrow-box {
background: url("http://img.webme.com/pic/d/design-adri/arrow.png") no-repeat scroll 15px center #EBFAB6;
border: 1px solid #BBCC5B;
color: #599847;
}
div.alert-box {
background: url("http://img.webme.com/pic/d/design-adri/alert.png") no-repeat scroll 15px center #FBDD96;
border: 1px solid #E5AF51;
color: #CA6B1C;
}
div.error-box {
background: url("http://img.webme.com/pic/d/design-adri/error.png") no-repeat scroll 15px center #FDD2D1;
border: 1px solid #F6988F;
color: #883333;
}
div.notice-box {
background: url("http://img.webme.com/pic/d/design-adri/note.png") no-repeat scroll 15px center #F9EBCA;
border: 1px solid #E5B2AC;
color: #9F6722;
}
div.info-box {
background: url("http://img.webme.com/pic/d/design-adri/info.png") no-repeat scroll 15px center #E6EBF0;
border: 1px solid #89BECD;
color: #277DCE;
}