Как сделать встроенный png <img> прозрачным с помощью css?

Как сделать встроенный png прозрачным внутри div? используя CSS

<div id="report'>
<p> some text </p>

<img src=transparent.png" />

</p>

</div>

это изображение для примера. Кроме мяча я хочу сделать прозрачную другую белую область. Который выглядит серым в IE6

альтернативный текст

Я хочу сделать в CSS, как это div#report img {.....} Является ли это возможным?

Редактировать:

Я не хочу делать все изображение прозрачным

Обновить:

Здесь я добавил пример http://jsbin.com/ubabo3

6 ответов

IE 6 не поддерживает прозрачные файлы png по умолчанию. Вам нужно использовать небольшой взлом для достижения прозрачных файлов PNG.

http://support.microsoft.com/?scid=kb%3Ben-us%3B294714&x=12&y=11

Попробуй это:

div#report img{
    background-color/**/: #000000;
    background-image/**/: none;
    opacity: 0.7;
    filter: alpha(opacity=70);
}

Свойство opacity применяется ко всем элементам (в поддерживаемых браузерах).

Я имел дело с проблемами IE6 PNG раньше, и это сработало..

то, что вы делаете, это добавить атрибут "поведения" к вашему

div#report img { behavior: url(iepngfix.htc) } 

и вы можете скачать файл - iepngfix.htc здесь и проверить онлайн-демонстрацию.. он объясняет все шаг за шагом

Я не уверен, что понимаю, но вы можете сделать изображение полностью прозрачным (т.е. невидимым):

div#report img { visibility: hidden } // Still takes up space
div#report img { display: none } // Hidden entirely - 

однако невозможно применить это только к изображениям png, по крайней мере, в CSS 2.1. Конечно, возможно использование некоторой дополнительной магии jQuery с помощью селектора, который проверяет .png в src имущество.

Вы не можете добавить поддержку прозрачности PNG в IE6, используя CSS. Есть хаки (некоторые из которых включают в себя, IIRC, вызов ActiveX в таблицу стилей), и Google найдет много для вас.

(Однако в эти дни я хотел бы отметить, что IE6 находится всего в нескольких неделях от End of Life, имеет небольшую долю рынка среди моей целевой аудитории и отказывается делать дополнительную работу, чтобы убедить ее выглядеть красиво)

Другие вопросы по тегам