Pregunta

He visto algunas correcciones para permitir que las imágenes PNG tengan transparencia en Internet Explorer 6, pero todavía tengo que encontrar una que también le permita establecer la posición del fondo en CSS.Si usas sprites, es un factor decisivo.He recurrido al uso de GIF (que no son de tan alta calidad), no uso imágenes transparentes en absoluto o sirvo una hoja de estilo completamente diferente a IE6.¿Existe una solución para IE6 que permita transparencias PNG Y posicionamiento de fondo?

¿Fue útil?

Solución

Sí.Convierta sus imágenes para usar paletas indexadas (png256).Puedes admitir transparencia (como gif), pero no un canal alfa.

Puedes hacer esto usando Irfanview y el complemento pngout, pngcuanto o pngnq.

El equipo de actuación de YUI también hizo un gran presentación que cubre este y muchos otros conceptos de optimización de imágenes.

Otros consejos

Este Es una nueva técnica que ha aparecido en el último mes.De la página:

En este script se admiten etiquetas de imágenes, con y sin un GIF espaciador en blanco, y los PNG de imágenes de fondo se pueden colocar y repetir, incluso si son más pequeños que el elemento de contenido en el que se encuentran.

Cuando el fondo es estático lo uso TweakPNG para cambiar el fragmento de Color de fondo en el PNG al color correcto (en lugar del color gris predeterminado).Cualquier navegador normal ignorará esto porque el canal alfa lo anula, pero IE6 y versiones anteriores usarán ese color en lugar del canal alfa.

Esto significa que tenemos transparencia en IE7+ mientras que se degrada muy bien en IE6 y versiones inferiores.Y todo el posicionamiento y repetición de CSS es posible (¡porque no hay trucos!).

DD_belatedPNG.js funciona muy bien

De hecho, puedes usar CSS puro para posicionar imágenes de fondo con transparencia alfa en IE6 aprovechando los filtros alfa de IE6 y el CSS. clip propiedad.Julien Lecomte describe la técnica en su blog.

Tenga en cuenta que esta técnica produce un impacto en el rendimiento por cada uso de un filtro alfa.

IE PNG Corrección v2.0 tiene soporte para alfa+ completoposition/repeat.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top