Прозорий Png у IE6, Блог вебмайстра Романа Чернишова

При верстці шаблону, перед нами дуже часто постає проблема коректного відображення прозорих/напівпрозорих зображень у форматі PNG у нашому «улюбленому» браузері IE6. Простіше кажучи, прозорості взагалі немає, замість неї ми бачимо суцільне тло певного кольору. Відмовитися ж від формату PNG в деяких випадках незручно, а в інших просто неможливо, та й дизайнери останнім часом стали нас все частіше балувати напівпрозорими тінями, відливами та іншими фішками художньої графіки.

І так ближче до суті, для вирішення вищеописаної проблеми існує кілька різних способів, я опишу кілька з них.

1) - «прозорий png вставляємо як картинку»:

у стилях картинки прописуємо параметрbehavior та підвантажуємо файлimages/png.htc, наступного змісту:

для нормального відображення картинки також знадобиться спеціальна прозора картинка GIF 1×1images/transparent.gif

2)- « PNG вставляємо як бекграунд використовуючи CSS і виводимо тільки в IE»

Код на сторінці буде дуже просто, всього в один рядок:

Задаємо стиль для цього дива

Цей спосіб взагалі є найзручнішим і простим, але має свої недоліки, наприклад, якщо у користувача в браузері буде відключена підтримка яваскрипт, то картинка буде відображатися без прозорості, уявіть якщо на сайті дуже багатий і насичений дизайн і таких картинок багато.

Але для реалізації цього методу на початок сторінки між тегами вставляємо:

4) - "Конвертація PNG в GIF"

Є ще такі варіанти як конвертація PNG в GIF при цьому прозорість збережеться і відмінно оброблятиметься IE6, але як я писав на початку статті перейти на інший формат у деяких випадкахнеможливо.