Efeito CSS nas imagens do Blog (Versão 4)

Olá Queridos Leitores! A quanto tempo não é mesmo! Após um longo tempo sem artigos aqui no Tecnoblog, venho dando continuação as postagens, hoje vamos aprender a adicionar o novo efeito as suas imagens do blog, O efeito CSS nas suas imagens, a Versão 4! Para isso vamos ao tutorial!


Único Passo - Instalando e utilizando o efeito nas imagens das postagens

1. Faça login no Blogger
2. Em seguida no menu suspenso, clique em Modelo.
3. Em seguida clique no botão em Editar HTML
4. E procure pela seguinte tag:

]]></b:skin>

5. E acima do código Citado acima, adicione o seguinte código: 


.post-body img {margin-left: 8px;
margin-bottom: 8px;
border-radius: 5px;
position: relative;
top: 0px;
-webkit-box-shadow: 0px 0px 5px black;
-moz-box-shadow: 0px 0px 5px black;
-o-box-shadow: 0px 0px 5px black;
box-shadow: 0px 0px 5px black;
-webkit-transition: all 0.25s linear;
-moz-transition: all 0.25s linear;
-o-transition: all 0.25s linear;
transition: all 0.25s linear;
}
.post-body img:hover {background: white;
opacity: 0.8;
-moz-opacity: 0.8;
filter: Alpha(Opacity=80);
border-radius: 20px;
}

6. Após isso clique em Visualizar, e se estiver tudo corretamente como desejado clique em Salvar Modelo! 

Pronto pessoal! Esta foi a post de hoje, sem mais delongas! E lembrando desculpem a falta de posts, ando muito ocupado mas se Deus quiser voltarei com as postagens diárias! Até mais, Fiquem Com Deus, Abraços!

0 comentários:

Postar um comentário