Efeito HeartBeat {Exclusivo!} | Blockquotes

{Créditos se usar, ok? ;♥ }

Oi gente ^-^
Eu trouxe, a pedido da Vick lá na Ask, alguns blockquotes fofinhos que eu mesma fiz. Eu tentei fazer uns bem diferentes, porém não tão exagerados como vemos em muitos blogs por aí. E eu também vim compartilhar com você um efeito bem legal que eu fiz ^-^

Gente, todos estão cansados de saber que tudo o que é postado aqui é meu (Shaking, Flipping, Menu Cute Flip, etc), mas eu vou ter que colocar {Exclusivo!} em todos os títulos de posts porque sempre tem aquelas pessoas cínicas. Isso não dá!
Mas indo ao assunto, clique em leia mais *-*

Para usar o blockquote, no HTML do seu blog aperte F3 e procure por ]]></b:skin> | Quando achar, acima cole:

blockquote {
text-align: justify;
font-family: trebuchet ms;
border-radius: 0px 0px 10px 10px;
background: #fff;
padding: 2px 3px 2px;
line-height:1.8em;
color: #DF2D58;
border-top: solid 4px #DF2D58;
box-shadow: inset 0 0 30px #eee, 0 0 4px #ccc;}

background: #fff; cor do fundo

color: #DF2D58; cor do texto

border-top: solid 4px #DF2D58; é o tipo de borda (solid) a grossura (4px) #DF2D58 é a cor

No HTML do seu blog aperte F3 e procure por ]]></b:skin> | Quando achar, acima cole:

blockquote {
text-align: justify;
font-family: trebuchet ms;
border-radius: 0px 10px 10px 0px;
background: #fff;
padding: 2px 3px 2px;
line-height:1.8em;
color: #DF2D58;
border-left: solid 4px #DF2D58;
box-shadow: inset 0 0 30px #eee, 0 0 4px #ccc;}

background: #fff; cor do fundo

color: #DF2D58; cor do texto

border-top: solid 4px #DF2D58; é o tipo de borda (solid) a grossura (4px) #DF2D58 é a cor

Efeito HeartBeat!

No HTML do seu blog aperte F3 e procure por ]]></b:skin> e quando achar, cole logo a cima:

@-webkit-keyframes efeito-heartbeat-isa {
1% {-webkit-transform: scale(0.8);}
50% {-webkit-transform: scale(1);}
100% {-webkit-transform: scale(1.1);}
}
@-moz-keyframes efeito-heartbeat-isa {
1% {-webkit-transform: scale(0.8);}
50% {-webkit-transform: scale(1);}
100% {-webkit-transform: scale(1.1);}
}
@-o-keyframes efeito-heartbeat-isa {
1% {-webkit-transform: scale(0.8);}
50% {-webkit-transform: scale(1);}
100% {-webkit-transform: scale(1.1);}
}
.efeito-heartbeat-isa {-webkit-transition: .5s; border:solid 2px #E42D8A;border-radius: 10px; box-shadow: 1px 1px #caebe6;}
.efeito-heartbeat-isa:hover {-webkit-animation: efeito-heartbeat-isa .5s alternate infinite linear; border:solid 2px #DC1B7A;}

border: solid 2px #E42D8A; é o tipo de borda, a grossura e a cor da borda. Se não quiser apague.

border-radius: 10px; borda arredondadas

border:solid 2px #DC1B7A; é a borda, a grossura e a cor quando passa o mouse por cima. Apague se não quiser.

Após mudar o que quiser, visualize e se estiver tudo bem, salve.

Vá em Layout • Adicionar Gadgets • HTML/JavaScript • Cole:

<a href="LINK"><img class="efeito-heartbeat-isa" src="URL DA IMAGEM" /></a>
<a href="LINK"><img class="efeito-heartbeat-isa" src="URL DA IMAGEM" /></a>
<a href="LINK"><img class="efeito-heartbeat-isa" src="URL DA IMAGEM" /></a>
<a href="LINK"><img class="efeito-heartbeat-isa" src="URL DA IMAGEM" /></a>
<a href="LINK"><img class="efeito-heartbeat-isa" src="URL DA IMAGEM" /></a>
<a href="LINK"><img class="efeito-heartbeat-isa" src="URL DA IMAGEM" /></a>

Prontinho ^-^ Espero que tenham gostado! {Se repassar, dê créditos!}