Aug 11

Как многим известно, Internet Explorer 6 (IE6) некорректно отображает прозрачность изображений в формате PNG-24. Для реализации в IE6 необходимо задействовать фильтр.
Например, у нас есть изображение image.png, которое является фоновым изображением. CSS-код будет выглядеть следующим образом:

div{
  background:url(image.png);
}
*html div{
  background:none;
  filter:progid:dximagetransform.microsoft.alphaimageloader(src='image.png', sizing-method='crop');
}

Важно! Путь к изображению указывается относительно страницы, а не CSS.

Но это еще не все :)

Если в наш контейнер поместить ссылку, то в IE6 она работать не будет. Вы спросите почему? Очень просто. Фильтр перекроет собой ссылку.
Для решения данной проблемы есть оптимальное решение. Необходимо назначить ссылке свойство position:relative. И лишь после данной манипуляции ссылка станет активной, образно говоря, поднимется выше фильтра.

При использовании PNG в качестве тянущегося фона необходимо в строке filter:progid… указать параметр sizingmethod=’scale’, тогда изображение будет растянуто по размеру всего блока.

Случайные записи

    Ответов: 3 на “ Прозрачность PNG-24 в IE6 ”

    1. БPATBOPA сказал:

      Любопытно! Спасибо за статью.

    2. Tonik сказал:

      Спасибо. Некоторые моменты прояснились. Не мог понять относительно чего прописывать адрес в фильтре

    3. admin сказал:

      Всегда пожалуйста :)

    Оставить ответ