• - ChapStique -

    - ChapStique -

  • - Crouton -

    - Crouton -

  • - Nadaddy -

    - Nadaddy -

  • - Fatty -

    - Fatty -

  • - Hollywood -

    - Hollywood -

17 de dezembro de 2012

Tutorial - Efeito Nebulla

Oi pessoal c:
Tudo bem com vocês ? Hoje estava procurando algum efeito legal para autores,até que achei o efeito 'nebulla',que você pode visualizar como vai ficar aqui. Bem lindo,né ? *-*

Enjoy ~

Vá no seu html e procure por ]]></b:skin>,quando achar,cole esse codigo acima dele:
figure { margin: 3px; width: LARGURApx; height: ALTURApx; overflow: hidden; position: relative; border: 3px solid #CORDABORDA; margin-right: 3px; float: left;} figcaption { font-family: verdana; font-size: 11px; position: absolute; display: block; width: 111px; height: 20px; left: 267px; bottom: 6px; text-align: center; color: #CORDAFONTE; text-shadow: none; background: url(http://i1234.photobucket.com/albums/ff411/SweetLG/78-1.png); border: 3px solid #CORDABORDADAFAIXA; line-height: 20px; box-shadow: rgba(0,0,0,.5) 0 2px 8px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transition-duration: 60s; -webkit-transition-duration: .60s;} figure:hover figcaption { left: 35px;bottom: 10px;}

Depois que estiver tudo pronto,salve,vá em layout e adicione um gadget e cole esse codigo:
<a href="SEULINK"><figure><img src="LINKDAFOTO" width="LARGURADAFOTO" alt=""/><figcaption>NOME</figcaption></figure></a> <a href="SEULINK"><figure><img src="LINKDAFOTO" width="LARGURADAFOTO" alt=""/><figcaption>NOME</figcaption></figure></a> <a href="SEULINK"><figure><img src="LINKDAFOTO" width="LARGURADAFOTO" alt=""/><figcaption>NOME</figcaption></figure></a>
Pessoal que estava participando do sorteio,clique aqui :( 

5 comentários:

  1. amei...
    Adoro seus tutoriais,mega bem explicados;
    =]

    segue lá?
    http://fantasiakawaii.blogspot.com.br/

    bjokonas e uma boa tarde

    ResponderExcluir
  2. Muito bom esse tutorial , talvez um dia eu coloque no DL . haha Seu blog é lindo parabens !.! <3
    Beijiinhos , Sguindo .
    http://doceeloucuraa.blogspot.com.br/

    ResponderExcluir
  3. Eu não consegui,a imagem fica uma embaixo da outra.
    E o tamanho da imagem é 100,e o do gadget é 300.
    Meu e-mail: Joana_rebelde2011@hotmail.com

    ResponderExcluir