Дано

Сайта aspekt-kor.com. Справа фотографии. Нужно делать их пнг. Потому что неизвестно сколько справа будет текста и коричневый фон может как увеличиваться, так и уменьшаться.

Картинка:

Источник

Решение

Скачиваем: файл Actions для фотошопа.

Вставляем эту картинку в новое окно.

Выбираем в панели actions действие transparenсy (!! фон должен быть прозрачным) и жмем пуск.

В результате должно получится два слоя:

изображение-png

сохраняем как foto.png

изображение gif

сохраняем как foto.gif

Теперь вставляем его в html.

<div class="foto"><div><!-- --></div></div>

И пишем стили для css

1
2
3
4
<style type="text/css">
.foto {background-image:url(картинка-png); width:301px; height:341px} 
.foto div {background-image:url(картинка-gif); width:301px; height:341px}
</style>

И пишем стили для ie5,6

1
2
3
4
5
<!--[if lt IE 7]>
<style type="text/css">
.foto {background-image:none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=картинка-png,sizingMethod=crop)} 
</style>
< ![endif]-->

Преимущества такого способа в том, что в ie5 все очень неплохо смотрится :)

Результат смотреть тут или тут