Веб-страница Круглые плавающие изображения

Question

Я пытаюсь выяснить, как воздушные шары на этом сайте имеют прозрачные края: http://www.dynamicdrive.com/dynamicindex4/flyimage.htm Когда я пытаюсь использовать округленное изображение, оно всегда имеет сплошные цветные углы, поскольку оно плавает вокругнезависимо от того, как я пытаюсь манипулировать исходным кодом страницы и CSS.Я попытался установить прозрачные цвета фона <div> и <img>, а также попытался использовать сценарий div с закругленными углами.Я отредактировал изображения в фотошопе так, чтобы они не имели пропусков (углов) вокруг них.Кажется, ничего не работает, и те же самые шары на моей странице выглядят как воздушный шар на квадратном белом фоне, который движется вокруг ... Есть идеи?

Answer 1

Томас был прав, что я не использовал правильный формат файла на изображениях. .GIF работает. Вам также необходимо убедиться, что вы удаляете не только пустое пространство на самом слое изображения в фотошопе, но и удаляете фон, и убедитесь, что размер холста отмечен как «относительный» в меню слоя.

Answer 2

Это просто прозрачный png

Чтобы проверить, возьмите их изображение и сделайте снимок на своей странице.Иногда изображения, которые кажутся прозрачными благодаря шахматной доске на заднем плане (из фотошопа), на самом деле имеют некоторый остаточный шум, который делает их нечеткими.Но изображение с квадратными углами может показывать, что сохранение с прозрачностью не было успешным.

Answer 3

Я видел это, создав серию плавающих элементов.Как то так:

[ div  ]This is my paragraph lorem
[ div   ]ipsum quod dolorat. And,
[ div       ]it wraps around the
[ div   ]image. Quite nicely. The
[ div    ]image itself get's no
layout.