El post-footer es el pié de cada entrada. Es donde aparece el nombre del autor, las etiquetas, los comentarios, etc. En muchas plantillas ésta parte no aparece claramente diferenciada y puede dar la sensación que la información que ahí aparece se confunde con la del post.
No hace mucho que explicaba la forma de poner imágenes en el título de cada post, pues bien, siguiendo la misma técnica también podemos colocar imágenes en el footer de la entrada. Si entonces utilizaba una imagen fija de gran tamaño y peso, ahora en el post-footer, para que resulte más rápida la carga de la página vamos a utilizar un imagen pequeña que se repita varias veces hasta llenar el hueco.
Para hacerlo necesitamos primero una imagen, que repetida varias veces, de la sensación de ser una sóla, yo he escogido ésta:
No hace mucho que explicaba la forma de poner imágenes en el título de cada post, pues bien, siguiendo la misma técnica también podemos colocar imágenes en el footer de la entrada. Si entonces utilizaba una imagen fija de gran tamaño y peso, ahora en el post-footer, para que resulte más rápida la carga de la página vamos a utilizar un imagen pequeña que se repita varias veces hasta llenar el hueco.
Para hacerlo necesitamos primero una imagen, que repetida varias veces, de la sensación de ser una sóla, yo he escogido ésta:
En el código que antes utilizabamos cambiamos el comando 'no-repeat' por 'repeat' y el resultado será el siguiente:
Además, podemos colocar bordes en el footer utilizando los códigos publicados en el post anterior y personalizar su color creando una variable para ellos. Podría quedar así:
Así ha quedado mi post footer:
.post-footer {
margin-bottom:15px;
margin-left:0px;
font-size: 87%;
background-image: url(http://blogs.terra.es/skins/sk_sp_temas/city/sidebar_bg.gif);
background-position: top center;
background-repeat: repeat;
}
No hay comentarios:
Publicar un comentario