Efeitos nas Ilustrações - Postagens.


Desculpem-me a demora para postar. Mas passei a tarde toda dormindo, depois choveu pacas e, para melhorar, acabou a luz aqui de casa. Depois eu entrei para postar e responder comentários, e me deparo com um dever de português. Não havia visto, na verdade foi bom ter visto. Bem, amei que tenham gostado do layout novo. Recebi algumas asks, que me elogiaram. Isso tem aumentado pedidos, obrigada Senhor!
Trouxe um tutorial de efeito que uso aqui no no blog. Eu aprendi lá no Too Kawaii, preciso mesmo linkar? Ele é bem simples e bonito. Achei tão fofo, mas não tão de acordo com o theme, mas gosto dele e ficou. 

1 - Abra seu CS e, nele, crie um arquivo de 500*300
2 - Pegue uma imagem em algum lugar. Tumblr e We<3It são bem recomendáveis. Copie-a e cole no arquivo. Ajuste-a do jeito que quiser e vá até o numero 3.
3 - Faça uma borda, a Great Border - tutorial original exclui o meu Ela é muito bonita e simples. 
4 - Pegue algum PSD, action e personalize a sua imagem. No Kawaii World, Mutable HTML, Things To Help You e alguns que postei aqui, servem. 
Meu Resultado:
Poder usar essa, ok?
Agora que você, lindinho, sabe fazer a imagem, é hora de personalizar no css (Acima de ]] no Blogger). Vá nele e cole isso nele. Não é um código de modificação, até porque é um tutorial de como deixar a imagem daquele jeito. E não personalize caso queira igual.
.post img {
-webkit-transition: all 1.0s linear;
-webkit-transition: all 1.0s linear;
-moz-transition: all 1.0s linear;
transition: all 1.0s linear;
-webkit-box-shadow: 0 0 .3em #transparent;
filter:alpha(opacity=65);
-moz-opacity:0.65;
opacity:0.65;
cursor: crosshair;
-webkit-border-radius: 15px;
-moz-border-radius:15px;
border-radius: 15px;
padding:4px;
border:1px solid #dedede;
}
.post img:hover {
-webkit-border-radius: 15px;
-moz-border-radius:15px;
border-radius: 15px;
-webkit-transition: all 1.0s linear;
-webkit-transition: all 1.0s linear;
-moz-transition: all 1.0s linear;
transition: all 1.0s linear;
filter:alpha(opacity=100);
-moz-opacity:1.0; opacity:1.0;
cursor: crosshair;
padding:4px;
border:1px solid #dedede;
}
Se quiser, ela postou algumas imagens no tutorial dela. Se não tiver entendido o meu, ou não quer fazer, aqui têm o tutorial da "Jana" me algumas imagens que ela fez.
Espero que tenham gostado.
Beijocas amorosas u3u
/Ana

7 comentários:

  1. Que lindo essa borda, sempre quis aprender. muito útil adorei ^-^

    Nyah Kawaii

    ResponderExcluir
  2. Muito fofo esse efeito ;), divo >.<, útil e lindo,tá bom parei, seguindo aqui tá linda ? Retribui a visita?

    Style Of Me

    ResponderExcluir
  3. Olá!,agora que vi que aceitou nosso pedido de afiliação,mil desculpas,eu sou a dona do Garotas Mimadas,mas mudei de url e agora ele é Pumpy Dreams,poderia atualizar na lista de afiliados?
    pumpy-dreams.blogspot.com.br/

    ResponderExcluir
  4. Adorei, achei fofo!

    Beijos ;3 | Eu Amo HTML | {euamohtml.blogspot.com}

    ResponderExcluir