martes, 17 de abril de 2012

Paso 18: Líneas horizontales

Las líneas horizontales que aparecen para delimitar los "post" pueden ser sosas y aburridas. Estas líneas aparecen con la etiqueta <hr>. Por ello, vamos a cambiarla por una imagen.
Lo primero que hago es elegir una imagen y subirla a este post, para así obterner la url de la imagen.

Imagen de muestra

Una vez he subido esta imagen, colocaré lo siguiente dentro de la hoja de estilo entre <head> y </head>:

div.hr {display:none}
/*/*/a{}
div.hr{
display: block;
height: 33 px;
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4m-c9-pfUuxpvmBxUROgFisMMHnb2eNYNQl6ZS6-LtQmxLTS4JZP4els-klqXU8AHxSGLBY40D-Y0yhFhrdfDZZLq80ZotlSwyuLbyRNgzFuOIdkEC8hGIkeqCvi1w5fU2lwQT8gM8Jw/s1600/capture-20120513-112151.jpg");
background-repeat: no-repeat;
background-position: center center;
margin: 1em 0 1em 0;
}
hr {display: none}
/* */

El siguiente paso para lograr que aparezca la línea en la parte inferior no he logrado realizarlo. Por más que he intentado no consigo dar con ello.

Problemas surgidos
No he logrado dar con dicho paso.

No hay comentarios:

Publicar un comentario