♦ Tutorial ~ Efeito Borderr

Hey Rilakkumas
  Hoje temos um tutorial que eu fiquei devendo há muito tempo, me pediram ano passado pela ask e nesse tempo eu reduzi meu tempo nos blogs e fui estudar desenhos.
  Então. Esse Aqui é a prévia do efeito, é o mesmo que estamos usando na elite de afiliados, fica muito bonito em imagens pequenas e fio eu mesmo quem criou, então créditos ao blog.. Vamos aprender.

Vá em Layout >> Adicionar um Gadget >> HTML/JavaScript
E cole isto


<style>
.borderr{
border-radius: 10px 30px / 20px 15px;
-webkit-transition-duration: .80s;
}
.borderr:hover{
border-radius: 5px ;
opacity:0.65;
-webkit-transition-duration: .80s;
}
</style>

E onde você quiser que apareça cole isso
<a href="URL DO BLOG" title="NOME DO BLOG" target="_blank"><img src="LINK DA IMAGEM" class="borderr" />
</a>

Muito simples não??? Por hoje é só, estou morto por culpa da aula de Ed. Física.

15 comentários:

  1. Simples até demais!

    Tava mesmo querendo aprender esse efeito, será que dá pra colocar no blockquote? Já vi gente usando nele *-*

    ResponderExcluir
    Respostas
    1. Obrigado, eu gostei dele por causa disso.

      Dá sim, é só trocar o .borderr por blockquote, super simples, mais ai tem que colocar background e padding.
      Ou só copiar o primeiro codigo e colar dentro de um codigo de blockquote já pronto.

      Excluir
    2. Entendi, vou usar, gostei muito *--*

      Excluir
    3. Se quiser eu posso preparar esse blockquote e postar.

      Excluir
  2. Legal esse efeito.

    blog-da-marci.blogspot.com.br

    ResponderExcluir
  3. Amo esse Efeito !!! , Muito Legal (:
    Seu blog é perfeito , Já virei Fã dele *o* , Adorei tudo por aqui , post's , cores & tudo mais , bem organizado e Bonito! ~ & Já estou Seguindo ~
    ~ Da Uma Olhadinha no Meu ??
    http://meubloguinhofofo.blogspot.com.br/
    Obrigado Pela Sua Atenção , Beijos ^~^

    ResponderExcluir
    Respostas
    1. Obrigado, ele é tão bonitinho mesmo, rsrsrs
      ohhh, não é não, assim fico com vergonha rsrsrs. Puxa uma fã, obrigado obrigado mesmo, é legal ter alguem que goste assim. Obrigado
      Claro que eu olho o seu blog.

      Excluir
  4. ah, o efeito é bem bonito. Mas sou uma negação com tutoriais, não sei se conseguiria colocar, sem bagunçar tudo no blog kkkkkk
    Estou te seguindo. :}

    - Vitamina de Pimenta -
    @LariCrazy_

    ResponderExcluir
    Respostas
    1. Esse é bem simples, kkkkkkkk, só colar no gadget e pronto.
      sem bagunça nem dor de cabeça.

      Obrigado

      Excluir
  5. Hello~ Então eu achei o blog de vocês, muito kawaii *-*
    Queria saber se vocês poderiam me adicionar no afiliado de vocês :B

    Nome do meu Blog: Reinado das Otomes Kawaiis

    Vou adicionar vocês nos meus afiliados ;3

    xoxo~

    ResponderExcluir
    Respostas
    1. Teu blog é muito lindo, eu adorei lá.
      Valeu por pedir, mas afiliação com blogs que tem no minimo minino 30 seguidores.

      Excluir
  6. Hahah, gostei do efeito e eu também fico morta da aula de Ed. física ><
    Porém minhas aulas ainda não começaram, ainda bem ^^

    Bjsss

    ResponderExcluir