Смотрите http://jsfiddle.net/aJ333/1/ в Chrome, а затем в Firefox или Internet Explorer. Изображение первоначально 120px, и я уменьшаю до 28px, но он выглядит неплохо в значительной степени независимо от того, к чему вы его масштабируете.
Изображение представляет собой PNG и имеет альфа-канал (прозрачность).
Вот соответствующий код:
HTML:
<a href="#" onclick="location.href='http://tinypic.com?ref=2z5jbtg'; return false;" target="_blank">
<img src="http://i44.tinypic.com/2z5jbtg.png" border="0" alt="Image and video hosting by TinyPic">
</a>
CSS
a {
width: 28px;
height: 28px;
display: block;
}
img {
max-width: 100%;
max-height: 100%;
image-rendering: -moz-crisp-edges;
-ms-interpolation-mode: bicubic;
}
Строки image-rendering
и -ms-interpolation-mode
CSS, похоже, ничего не делали, но я нашел их в Интернете, проводя некоторые исследования проблемы.