Прозрачный gif не прозрачный?

Question

Я загрузил прозрачный png с сайта findicons.com, и я подумал, что если бы я разместил этот png на моей странице html, у которого был градиентный цветной фон, я бы увидел только значок (стрелка вниз в этом случае). Вместо этого, однако, я вижу значок и белый (ish) поле, окружающее значок. Попробовали установить стиль фона на прозрачный или наследовать, а border - на none, но это, похоже, не помогает.

Я не уверен, что моя проблема здесь. Это факт, что у меня есть фон тела, который является градиентным цветом? Это факт, что я использую PNG? Это потому, что иконка, которую я загрузил, не прозрачна, хотя сайт, на котором я скачал ее, говорит, что это так? Это потому, что я только начинаю строить сайт?

Пожалуйста, любые предложения? Спасибо.

Это страница, где я пытаюсь достичь этого: Not working example

Answer 1

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

Answer 2

PNG - единственный образ, совместимый с прозрачным. Вам не нужно устанавливать какие-либо стили для прозрачности изображения, поскольку это PNG. Файл не должен быть прозрачным (даже если говорят, что это так).

Я рекомендую бесплатно скачать инструмент paint.net, чтобы просмотреть картинку более подробно. Используя это программное обеспечение, вы можете вырезать вокруг стрелки и сохранить его как PNG. Поэтому создается собственный образ.