为什么Firefox中调整大小的图像会在它们下面出现黑线?

时间:2010-05-18 09:13:48

标签: html css image

如果您拍摄以下图片:

http://ecx.images-amazon.com/images/I/41uxky7oT8L._SL160_.jpg

将其放在带有IMG标签的html文件中,然后将其调整为宽度160,但不设置高度设置,并且在Firefox上,您将在图像下看到一条丑陋的黑线。

例如:

<img src="http://ecx.images-amazon.com/images/I/41uxky7oT8L._SL160_.jpg" alt="" width="160" />

<img src="http://ecx.images-amazon.com/images/I/41uxky7oT8L._SL160_.jpg" alt="" style="width:160px;" />

(注意我在Ubuntu Linux 8.04 LTS上使用FF 3.6.3,如果重要的话。)

注意我不想设置高度,因为当我想要做的就是改变宽度以便在亚马逊产品列中很好地适应时,图像看起来会很有趣。另外,我无法始终准确地预测图像高度,而某些用于检查图像的API可能会使网站速度过慢。

那么,为什么你认为黑线出现了,我可以在HTML或CSS中以编程方式做什么来阻止呢?注意我已经尝试将图像的背景颜色样式设置为#FFF,我仍然遇到这个问题。

1 个答案:

答案 0 :(得分:1)

根据需要使用JavaScript调整图像大小以防止浏览器失真。我之所以这样做是因为只有Opera和Chrome可以将大图像“平滑调整”到小尺寸。