Separando nuestros posts

Continuamos añadiendo elementos de diseño a nuestro blog, en este caso una sencilla separación entre las entradas que puede resultar vistosa si se hace adecuadamente.

El proceso y el código en este caso es muy fácil, solo debemos añadir la imagen que queremos en la carpeta “images”(o la que querais) de nuestro tema, buscar el css y modificar la clase “post” añadiendo esto:

1
2
3
4

 
.post{
     background: transparent url(images/tuImagen.gif) no-repeat bottom;
}

Si al igual que yo, teneis otro texto debajo de la entrada en sí, en mi caso las categorías y tags, podeis añadirle un “margin o padding” para que no se superpongan:

1
2
3
4
5
6

 
.post{
     background: transparent url(images/tuImagen.gif) no-repeat bottom;
     padding-bottom:20px;
     margin-bottom:10px;
}

Por internet hay montones de barras separadoras gratis, pero os aconsejo ser creativos y hacer la vuestra, para darle al blog un toque más personal.

Tags: barra, hr, separacion

Domingo, Junio 7th, 2009 a las 14:05