Como colocar una imagen en el borde del blockquote

3 de noviembre de 2014



Hoy les traigo un corto y sencillo tutorial de como colocarle un pattern a los bordes del blockquote como pueden ver en la imagen de ejemplo o también pueden chequear el resultado en mi blog de pruebas

Paso 1

Vas a Plantilla | Editar HTLM | y encima de ]]></b:skin>  pegas el siguiente código:
     
blockquote {
background: #fafafa; /* Color del fondo de la caja */
padding: 5px;
color: #666; /* Color del texto */
border: 10px solid ; /* Grosor del borde */
box-shadow: inset 0 0 10px #bbb, 0 0 5px #bbb; /* Sombra dentro de la caja */
border-image: url('http://1.bp.blogspot.com/-UhGg4MhS2u4/VFg16nUcIXI/AAAAAAAAEvA/aSN5Vd6e1YM/s1600/3817521.png') /* Url de la imagen del borde */
    20 20 round; /* Escala de la imagen del borde */}

Paso 2

Ahora solamente debes de editar cada cosa a tu gusto:
Donde dice /* Escala de la imagen del borde */ es para ajustar el tamaño de la imagen que aparecerá en el borde del blockquote..
si pones un numero menor, como 10 10 round; la imagen será mas grande..
si pones un numero mayor como 30 30 round; la imagen será mas pequeña..

RECOMENDACIÓN
Si ya tenias tu antigua blockquote personalizada, te recomiendo que borres  el código que ya tenia tu plantilla y que lo remplaces con el que deje.. si no podría no quedar bien al superponerse ambos códigos..

[¡Soy luz!] - Tarjetas imprimibles|♥


Hoy es traigo estas lindas tarjetitas con frases para imprimir.. espero les guste

Tamaño: 4,2cm x 10,5cm


Para imprimirlas solo añades las que te gustan en un archivo word y lo imprimes


TIPS: al imprimirlos pégalos sobre una cartulina o imprimelos en una hoja gruesa para que tengan mayor dureza.

TIPS: ver tutorial como hacer tu propia tarjeta imprimible con photoshop

TIPS: si quieres puedes agregarle una linda borla o pompom en uno de los extremos para decorarlo mejor!
Ver tutorial de como hacer una borla o pompom
Idea del pompom gracias a Cerecita Bombom