Como colocar as imagens no blog com efeito Zoom | Quero Dicas Quero Dicas : Como colocar as imagens no blog com efeito Zoom

Quero Dicas : Como colocar as imagens no blog com efeito Zoom

Como colocar as imagens no blog com efeito Zoom

| |

Hoje eu trouxe um tutorial de imagem com efeito Zoom que eu aprendi no Kawaii World.

Esse efeito é bem legal para vocês colocarem nas imagens do seus blogs. Eu achei show! Espero que vocês também gostem.



Instalando

1 - Acesse o painel do seu blog.

2 - Vá em "Modelo" e "Editar HTML"

3 - Tecle Ctrl + F e procure por:

 /* Posts
-------------------------------- */ 

4 -  Abaixo dele, cole:

 .post img {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-webkit-transition: 0s linear;
-webkit-transition: opacity 0.5s linear;
-webkit-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
transition: all 0.2s linear; /*----Tempo de transição ----*/ 
background-color: #00BFFF; /*---- Cor ----*/ 
padding: 2px;
}
.post img:hover {
-webkit-transform: scale(1.20);
-moz-transform: scale(1.20);
background-color: #FFC0CB; /*---- Cor ----*/ 
padding: 2px;
} 



      Personalizando


Agora é só personalizar as cores que deixei em destaque para vocês.
Tabela de cores - AQUI

SAIBA: Ao colocar este tipo de efeito no seu blog, as que tem fundo transparente, elas ficaram com todo o fundo igual a cor escolhida para a borda das imagens.

E ai, também gostou? Comente! 
Beijinhos




Compartilhe

* Você reservou um tempinho para comentar? *

Desde já agradeço!

Devido a falta de tempo, não prometo responder a todos os comentários. Mas farei o possível!


Nenhum comentário:

Postar um comentário

Amigos do Blog

agenda dos blogs Universo das Dicas

Ganhe Visitantes | Inscreva-se!

GeraLinks Linkicha Atoananet Linkirado
subir