efeito alpha em imagem

[RenanChagas 0]

Boa tarde,

 

Gostaria de saber se alguem sabe como criar o efeito alpha visto aqui: https://plus.google.com

 

Onde está escrito:

 

// Join Google+

Just sign in with your Google account to start using the new parts of Google.

//

 

O quadrado de fundo transparente que possibilita ver a imagem de background

[brunosk2 0]

Você cria a div que vai ficar no fundo, seta o background nela, e na div dentro você seta um background com opacity.

Ou você faz uma imagem no photoshop da cor que você quer, diminui a transparencia (no exemplo deixa em 90%), e salva como PNG.

Obs: A segunda alternativa é para os IEs que não lêem a propriedade opacity, pro IE você tem que pesquisar sobre filtros de opacidade.

Exemplo

.fundo{
background: imagem do fundo
}
.transp{
background-color: #1F1F1F;
opacity: 0.9;
}
/*Isso não vai junto, é só caso você use a imagem transparente, ai você não usa o outro .transp*/
.transp{
background: Imagem PNG com transparencia;
}
<div class="fundo">
<div class="transp"></div>
</div>

[RenanChagas 0]

Consegui fazer funcionar, mas no IE não funciona.

 

Alguem sabe uma solução?

 

 

Agradeço desde já