Como usar PNG transparente no Internet Explorer 6
Postado em 9 de agosto de 2008 em Aprenda NumClique
Para você, desenvolvedor web, que sempre que termina um layout, lamenta porque não poderá utilizar aquele png transparente tão bonito e caprichado em seu site e você o substitui por um gif para que o resultado fique ao menor próximo do esperado… relaxe… a dica de hoje irá te ajudar a contornar essa burrice do Internet Explorer 6 (IEca 6)…
Para utilizar o png transparente no IEca 6, você terá que fazer um comentário condicional para o IEca 6 da seguinte maneira…
<!–[if IE 6]>
<style type=”text/css”>
</style>
<![endif]–>
Logo após ajustar o comentário condicional no topo do seu site, você irá fazer a simulação do Filtro Alpha para o IEca da seguinte maneira…
<!–[if IE 6]>
<style type=”text/css”>
#seletor {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”SuaImagem.png”, sizingMethod=scale);
}
</style>
<![endif]–>
Fazendo isso, sempre que você precisar utilizar um png transparente em um layout, não precisará mais fazer um gif transparente para substituir a imagem…
[NOTA]
- O motivo do Internet Explorer 6 não aceitar a transparência dos arquivos .png é por conta da ausência do suporte ao Filtro Alpha…
- Para saber mais sobre Comentários condicinais, clique aqui
Joares Miranda
Webdesigner, twitteiro, blogueiro. Para alguns, um falso nerd, acho que por conta de não perder a chance de gastar horas num bom papo off-line
Ver todos os posts de Joares Miranda | Twitter: @joares
Comentários
Sidney
em 5 de março de 2009
Infelizmente essa solucao pra transparencia de PNGs no ie6 nao funcionou (ow lixo de navegador que é esse hein). Até agora não encontrei uma que funcionasse.
Mesmo assim valeu pela tentativa.
Abraço.
Natanael
em 12 de junho de 2009
Eu uso javascritp também, vou deixar aqui o link de uma solução em javascript, quem se interessar: http://www.comocriarsites.com.br/Png-transparente-no-internet-explorer_b_1.html
Bom trabalho a todos
sergio ronei hentz
em 20 de novembro de 2009
Puxa vida, muito util.
Publicidade - Skybanner
Enquete da semana
Posts recentes
- Site reúne fotos de carros órfãos
- A anatomia dos produtos da Apple
- Homens de verdade desenham fuzis no Paint
- Pendrive em forma de arma #euquero
- Sony lança Bravia 3D com sensor de movimento
- Cubo mágico para cegos
- CutMp3.net – ferramenta online para editar arquivos mp3
- LG POP, o touchscreen barato da LG
- Três modos de preparar cabeça de Steve Jobs com queijo
- Divulgue seu currÃculo no Twitter
- Oblique Clock, um relógio para malucos
- MacMote: Controle seu Mac com o celular
- Nokia N900 x Samsung Omnia2 x iPhone 3G S. Qual o melhor?
- Pedra, papel e tesoura para pessoas solitárias #euquero
- Alternative To – Um excelente site para quem procura uma alternativa para um aplicativo
Publicidade - miniquadrados submarino
Categorias
- Apple
- Aprenda NumClique
- Blogosfera
- Campus Party
- Celulares
- Comédia
- Como fazer
- Curiosidades
- Desenvolvimento Web
- Design Web
- Destaque
- Dica de Site
- Enquete da Semana
- Eu quero
- Filmes
- FireFox
- Fotografia
- Imagem do dia
- Internet
- Jogo da semana
- Jogos
- Linux
- Microsoft
- Review
- Software
- Tecnologia
- Tirinhas
- VÃdeos
Arquivo
- março 2010
- fevereiro 2010
- janeiro 2010
- dezembro 2009
- novembro 2009
- outubro 2009
- setembro 2009
- agosto 2009
- julho 2009
- junho 2009
- maio 2009
- abril 2009
- março 2009
- fevereiro 2009
- janeiro 2009
- dezembro 2008
- novembro 2008
- outubro 2008
- setembro 2008
- agosto 2008
- julho 2008
- junho 2008
- maio 2008
- abril 2008
- março 2008
- fevereiro 2008
- janeiro 2008












Cayo Medeiros aka. yogodoshi
em 1 de outubro de 2008
Cara, ter que colocar um código desses pra cada imagem PNG com fundo transparente que você tiver não é mole não…
Mas a dica é boa, apesar deu ainda preferir, no meu atual caso, usar o javascript pra isso.
Abração!