ir arriba

23 marzo 2007

Dobles comillas

En muchos blogs se adornan comentarios, citas o proverbios con una imágen de unas dobles comillas de apertura. Os voy a explicar a continuación como añadir esta opción.

En primer lugar tenemos que tener una imagen, un pequeñito gif con las dobles comillas, como ésta:

Ejemplo:









Código css: Pegar debajo del <head>

<style>
blockquote {
background: url(comillas.gif) no-repeat 0 3px;
color: #666;
padding-left: 20px;
font-style: italic;
margin-bottom: 1px;
display:block;
padding-top:7px;
}
</style>

Código html correspondiente a los comentarios que queramos resaltar: pegar en crear entradas.

<blockquote> Aquí el texto</blockquote>

Para modificar el texto ( css )
En la ( url ) se debe poner el enlace a la imagen con las dobles comillas.
( Color ) y ( font-style ) se define el tipo de color y letra.
( Padding-left ) sirve para anidar hacia la derecha el texto.
( margin-bottom ) para separar el texto por el borde inferior.
( padding-top ) para desplazar el texto un poco hacia abajo.

Aquí os dejo algunos gifs:

Para copiar estos gifs: botón derecho y ( guardar imagen como) y lo guardáis en una carpeta.
con estos sencillos pasos mejorará el aspecto de vuestros blogs.
saludos.

No hay comentarios:

© josscat.blogspot.com 2007