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..
