Códigos CSS - Imagens Transparentes

Um efeito legal de usar é deixar as imagens meio transparentes quando colocamos o mouse sobre elas, e o código para fazer isso pode ser usado em cada imagem separadamente ou em todas as imagens das postagens ou das colunas de menu do blog e ainda no blog inteiro se preferir.

O código pra deixar a imagem transparente você deve colocar na página editar html, depois de body{...}, mas cuidado para não colocar dentro das chaves do body porque tudo que estiver entre elas modifica a página inteira, veja na imagem:



no exemplo modificamos todas as imagens das postagens, caso esteja ruim de ver o código na imagem ele está aqui:

.post img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity:
1}

.post a:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity:
0.5}



Da mesma maneira que fizemos isso com as postagens poderíamos fazer com a coluna lateral de menu, apenas trocando a palavra post por sidebar ou o nome que tiver a coluna do seu blog. Porém se quiser colocar esse efeito em apenas algumas imagens por exemplo nos banners que mostra no seu blog, faça da seguinte forma em vez da palavra post coloque no código banner, isso é apenas um exemplo poderia ser quaisquer outras palavras desde que você não tenha usado a mesma para nenhum outro estilo CSS. Isso também na página editar html. Então o código ficará assim:

.banner img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity:
1}

.banner a:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity:
0.5}


Depois entre na página layout, clique em adicionar gadget, html/javascript e coloque o código das imagens (neste caso os banners), porém o código das imagens tem que estar entre divs (podem ser quantas imagens quiser), deste modo:

<div class="banner">Código das Imagens</div>


Isso fará que apenas as imagens que estiverem neste trecho fiquem semitransparentes quando colocar o mouse sobre elas.

Procurar no site

Mega Filmes usado por domínio redirecionado (DOT Tk) . 2009 - Todos os direitos reservados.