Bloquote style {3}

Live Preview: https://plantilla6amarys.blogspot.com/ 

Tema - Personalizar (Editar HTML) - CTRL+F y buscas: ]]></b:skin>

Arriba de ]]></b:skin> pegas lo siguiente:

 blockquote{

background:url(http://i.imgur.com/2qzVi.png);

padding:10px;

border-left:20px solid #b08e71;

border-right:0px solid #b08e71;

-webkit-transition: all 0.5s ease-in-out;

-moz-transition: all 0.5s ease-in-out;

-o-transition: all 0.5s ease-in-out;

-ms-transition: all 0.5s ease-in-out;

transition: all 0.5s ease-in-out;

color:#555;

}

blockquote:hover{

border-left:0px solid #e695af;

border-right:20px solid #e695af;

color:#555;

}

Bisel Scrollbar

Tema - Personalizar (Editar HTML) - CTRL+F y buscas: ]]></b:skin>

Arriba de ]]></b:skin> pegas lo siguiente:

 ::-webkit-scrollbar{ width:7px;height:7px;} /* Largura da barra */

::-webkit-scrollbar-track-piece{background-color:#fff;} /* Fondo de la barra larga */

::-webkit-scrollbar-thumb:vertical{height:50px; background-color:#FFC9D9; /* Estilos da barra vertical */

box-shadow: inset 1px 1px 0px #fff;

border: 1px solid #FFC9D9; /* Borde de la barra */

::-webkit-scrollbar-thumb:horizontal{width:50px; background-color:#FFC9D9; /* Estilos de la barra horizontal */

box-shadow: inset 1px 1px 0px #fff;

border: 1px solid #FFC9D9; /* Borde de la barra */

}

Menú Cute

Home Afiliados Tutoriales Recursos Otros

Pegar en un gadget HTML

<style>

nav a {

 position: relative;

 display: inline-block;

 margin: 5px 5px;

 outline: none;

 color: #fff;/* Color del texto*/

 text-decoration: none;

 font-style: italic;

 font-family: georgia;

 letter-spacing: 2px;

 font-weight: 400;

 text-shadow: 0 0 1px rgba(255,255,255,0.3);

 font-size: 1.35em;

}

nav a:hover,

nav a:focus {

 outline: none;

}

.menu10 a {

 line-height: 2em;

 -webkit-perspective: 800px;

 -moz-perspective: 800px;

 perspective: 800px;

}

.menu10 a span {

 position: relative;

 display: inline-block;

 padding: 3px 15px 0;

 background:url(http://24.media.tumblr.com/tumblr_md47p4NYAg1rijbyfo1_500.jpg);/* Fondo del menu*/

 box-shadow: inset 0 3px #B482D0;/* Borde superior del menu*/

 -webkit-transition: background 0.6s;

 -moz-transition: background 0.6s;

 transition: background 0.6s;

 -webkit-transform-origin: 50% 0;

 -moz-transform-origin: 50% 0;

}

.menu10 a span::before {

 position: absolute;

 top: 0;

 left: 0;

 width: 100%;

 height: 100%;

        background: #B482D0;/* Fondo del menu cuando pasa el cursor*/

        color: #000;/* Color del texto cuando pasa el cursor*/

 content: attr(data-hover);

 -webkit-transform: rotateX(270deg);

 -moz-transform: rotateX(270deg);

 -webkit-transition: -webkit-transform 0.6s;

 -moz-transition: -moz-transform 0.6s;

 transition: transform 0.6s;

 -webkit-transform-origin: 0 0;

 -moz-transform-origin: 0 0;

 transform-origin: 0 0;

 pointer-events: none;

}

.menu10 a:hover span::before,

.menu10 a:focus span::before {

 -webkit-transform: rotateX(10deg);  -moz-transform: rotateX(10deg);

 transform: rotateX(10deg);

}

</style>

<center><nav class="menu10">

 <a href="Url del la pagina"><span data-hover="Home">Home</span></a>

 <a href="Url del la pagina"><span data-hover="Afiliados">Afiliados</span></a>

 <a href="Url del la pagina"><span data-hover="Tutoriales">Tutoriales</span></a>

 <a href="Url del la pagina"><span data-hover="Recursos">Recursos</span></a>

 <a href="Url del la pagina"><span data-hover="Otros">Otros</span></a>

</nav>

</center>

Tutorial: Publi/Friends style #1

Pegar en un gadget HTML:

 <style>

#comida a img{

width:43px;

height:43px;

display:inline;

margin-right:2px;

margin-left:1px;

margin-top:1px;

margin-bottom:1px;

padding: 3px;

background: #f1f1f1;

box-shadow: 1px 1px 0px #ccc;

outline: solid 1px #fff;

outline-offset: -5px;

-moz-transition: all 0.5s ease-out;

-webkit-transition: all 0.5s ease-out;

-o-transition: all 0.5s ease-out;

-ms-transition: all 0.5s ease-out;

transition: all 0.5s ease-out;

}

#comida a:hover img{

outline: solid 3px transparent;

opacity: 0.5;

outline-offset: -20px;

}

</style>

<div id="comida">

<center>

<blackie><a href="linkfriend" title="friend1">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend2">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend3">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend4">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend5">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend6">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend7">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="friend8">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

<a href="linkfriend" title="name9">  <img src="https://media.giphy.com/media/DVvC66lWbGB8s/giphy.gif" /></a>

</blackie></center></div>

<style>

a.jeonjin1 {

letter-spacing:1px;

-webkit-transition: all 0.2s ease-out;

-moz-transition: all 0.2s ease-out;

transition: all 0.2s ease-out;

cursor:pointer;

display:inline-block;

font:8px tt;

text-align:center;

width:30px;

height:10px;

color:#888 !important;

padding:5px;

padding-top:15px;

background:#eee;

text-decoration:none;

-webkit-border-top-left-radius: 33px;

-webkit-border-top-right-radius: 33px;

-moz-border-radius-topleft: 33px;

-moz-border-radius-topright: 33px;

border-top-left-radius: 33px;

border-top-right-radius: 33px;

border:2px solid #ddd;

border-bottom:none;

}

a.jeonjin1:hover{

background: #fff;

color:#333 !important;

}

@font-face {

font-family:tt;

src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');

}

Tutorial: Status Haruharu

 Pegar arriba de ]]></b:skin> y editar

.haruharu a {

color:#ffffff;

}

.haruharu {

color:#404040;

font: 8px "handy", small fonts;

text-transform: uppercase;

text-align:left;

background: #E8AFFF;

margin-bottom: 2px;

padding:2px;

padding-left: 8px;

-webkit-transition-duration: .99s;

border-radius: 2px;

box-shadow:inset 0px 20px 0px #ECECEC;

}

.haruharu:hover {

color:#404040;

padding-left : 15px;

box-shadow: inset 0px -24px 0px #BFEDFF;

text-shadow: 1px 1px 0px #d2d2d2;

}

Y en un gadget HTML pegar y editar:

<div class="haruharu"><img src="linkfoto"/>Tema: Tutoriales, Recursos y Descargas</div>

<div class="haruharu"><img src="linkfoto"/>Estado: Activo</div>

<div class="haruharu"><img src="linkfoto"/>Meta: 300 seguidores</div>

<div class="haruharu"><img src="linkfoto"/>Contacto: amanduu35@hotmail.com</div>

<div class="haruharu"><img src="linkfoto"/>Blog made in:<img src="link" /></div>

Tutorial: Menú Cintas

HOME TUTOS RECURSOS AFFIES PEDIDOS

Pegar en un gadget HTML el siguiente código y editar:

 <style type="text/css">

.hCT {

padding: 3px 5px 7px 5px;

position: relative;

background: #BFEDFF; /* FONDO DEL MENU */

border-radius: 0;

z-index: 1;

outline-offset: -3px;

outline: 1px dashed #ddd; /* BORDE ENTRECORTADO */

}

.DRAGONS {

position: relative;

width: 570px; /* LARGO DEL MENU */

}

/* COLORES DE LAS PUNTAS Y DOBLES IZQ. */

.DRAGONS:after {

border-color: #E8AFFF transparent #E8AFFF #C69BD7;

border-style: solid;

border-width: 15px;

content: "";

position: absolute;

right: -16px;

top: 14px;

}

/* COLORES DE LAS PUNTAS Y DOBLES DER. */

.DRAGONS:before {

border-color: #E8AFFF #C69BD7 #E8AFFF transparent;

border-style: solid;

border-width: 15px;

content: "";

position: absolute;

left: -16px;

top: -14px;

}

a.linksCT {

color: #000000; /* COLOR DE LINKS */

text-decoration: none;

text-shadow: 0px -0px 0px transparent,

             0px 0px 0px transparent;

}

.linksCT {

font: 9px georgia; /* TIPO DE LETRA DE LINKS */

text-transform: uppercase;

-webkit-transition-duration: 0.5s;

margin: 3px;

letter-spacing: 2px;

}

.linksCT:hover {

color: transparent;

text-shadow: 0px -1px 0px #C69BD7, /* COLOR DE LINK HOVER */

             1px 1px 0px #7c9222; /* COLOR DE SOMBRA */

}

</style>

<div class="DRAGONS">

<div class="hCT">

<center>

<a href="http://unatierraparachicas.blogspot.com" class="linksCT">HOME</a>

<a href="http://unatierraparachicas.blogspot.com/p/tutoriales.html" class="linksCT">TUTOS</a> 

<a href="http://unatierraparachicas.blogspot.com/p/recursos_18.html" class="linksCT">RECURSOS</a>

<a href="http://unatierraparachicas.blogspot.com/p/afiliados.html" class="linksCT">AFFIES</a>

<a href="http://adf.ly/wyMrk" class="linksCT">PEDIDOS</a>

</center>

</div>

</div>