Mensaje de alerta con CSS para el Blog

Navegando por Bioneural.Net me encuentro con este bonito estilo de mensaje de alerta que te enseñaré más adelante, así que sigue leyendo este post.

Si quieres poner un mensaje de alerta en tu blog, este post te vendrá bien, ya que veremos cómo podemos poner un mensaje con estilo para que los lectores de nuestro blog puedan leerlo.

Este mensaje de alerta con CSS podemos utilizarlo para cuando estamos cambiando el diseño al blog, mantenimiento, problemas para suscribirse, o para lo que tú veas comveniente.

Para poner un mensaje de alerta en tu blog ve a Diseño > Edición de HTML > justo antes de ]]></b:skin> pega el siguiente código CSS para darle estilo:

.alert {
background: #fff6bf url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg53_xBK7ziqo9SiCSbkprAYNfbpZrpM8u4BYB3lKDE4_6OyvO1ZKhkgjr3kzMxZKMHPxwvgmb4mQKfUptr-9CFfVPimelL96ezrFd_rcwVqbEVZ-Vr1mLur8O6qHSe-1HFtzkoTGIQ4LU/s320/alert.png) center no-repeat;
background-position: 15px 50%; /* x-pos y-pos */
text-align: left;
padding: 5px 20px 5px 45px;
border-top: 2px solid #ffd324;
border-bottom: 2px solid #ffd324;
}

Ahora  le añadiremos class="alert" al mensaje para que funcione el estilo CSS que acabamos de añadir, para ello copia el siguiente código:

<p class="alert">Aquí el texto que quieres poner en el mensaje</p>

Pégalo en un Elemento HTML en la sidebar de tu blog.

Lo que está en color azul cambialo por la URL  de tu imagen.
El estilo es totalmente configurable, pueden cambiarle el color, ensanchar los bordes, o cambiar la posición de la imagen.