Как сделать встроенный 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, имеет небольшую долю рынка среди моей целевой аудитории и отказывается делать дополнительную работу, чтобы убедить ее выглядеть красиво)