CSS, Efeito clarear e escurecer em CSS




http://informaticode.blogspot.com.br/search/label/css
Quer colocar aquele efeito nas imagens que quando ambas são focadas com  o cursor   do mouse, elas escurecem ou     clareiam? Isso pode ser  facilmente obtido com CSS!   O ideal para se utilizar dessa possibilidade,  são nos ícones de redes sociais, ou nos banners de parceiros no qual poderá dar um destaque! Siga lendo este tutorial e saiba com fazer isso!




Copie o código CSS abaixo e cole no HTML do seu post.


<style>
.efeito img{
 border: #191919 solid 2px; /*esta linha aplica uma borda cor preta na imagem*/
 opacity: 1.0; /*esta linha é a que escurece a imagem*/
 }

.efeito img:hover{
 border: #191919 solid 2px; /*esta linha aplica uma borda cor preta na imagem*/
 opacity: 0.2; /*esta linha é a que clareia a imagem*/
 }
</style>


Após colar o CSS, copie o código HTML abaixo:


<div class="efeito"> Coloque aqui todo o código dos ícones/banners nas quais que que receba o efeito.
</div>




Depois de copiar cole no gadget em que se encontra as imagens/banners/ícones,  e mova todo o código das imagens/banners/ícones para o lugar do texto destacado em laranja e salve!



Você pode usar o mesmo código HTML para aplicar o efeito em outras imagens, seguindo o mesmo passo: copiar o código HTML, colar, e mover os códigos das imagens/banners/ícones para o lugar do texto em laranja.



OBS: Não é preciso repetir o CSS!!!


HOT NA SEMANA

C, Ordenar um Vetor em Ordem Crescente

C++, Tabuada com código super simples

C, Programa Números em Ordem Crescente







© Copyright 2017 - INFORMATICODE, todos os direitos reservados.