看到这个：缩小img而不损失质量？
http://real-sense.com/index.php?option=com_content&view=article&id=106
使用CSS
.thumbnail-product-resize
{
width:144px;
height : auto;
}
有谁知道如何做到这一点的更清洁的方式，所以我不正在调整设定右侧垂直图像在图像上丢失质量？
我的意思是说，如果我用photoshop调整了图片的大小，那么文字就不会像这里那样模糊。
在FF测试
感谢
图片的质量取决于您使用的图片的原始大小。如果有一个高质量的大图像，比如大小为400x500，然后将其大小调整为80x100，则它仍然是400x500图像。但是，您只能在80x100的较小图像上适合一定数量的像素，因此必须对这个较大的图像进行采样。这意味着平均值取像素，然后代表一个80x100大小的图像。 如果你想得到更确切的结果，你可以改变图像的原始尺寸为80x100。这可能会给你更好的结果。
最佳答案。感谢您的解释。 – user1788175
就算你在Photoshop这样做那些你有图像仍然会出现相当多的方式只是现在要做的。
仅供参考如果您不需要在上面的CSS中包含height：auto，
最好的办法是创建一个单独的缩略图（使用photoshop），它可能只是显示图像的一部分。
加载缩略图并以css的方式调整它们的大小是一种糟糕的做法，因为您仍然在先让用户下载大图像。
通过让浏览器调整整个图像来缩小缩略图的术语是“缩略图”。 –
大声笑，谢谢你们。赞赏 – user1788175
除非它是矢量图像，否则不可能在不失去质量的情况下缩小图像。这意味着你不得不使用SVG。考虑到显示的图像，我认为你不会那样做。
你也提到了更干净的方式来做到这一点，使用Photoshop或类似的东西。
在这种情况下，SVG会以同样的方式丢失质量，但仍会渲染到具有较少像素的基于栅格的输出。 –
@DA这是真的，我的答案不清楚。感谢您指出这一点，我的意思是，它只能缩小矢量图像而不会丢失信息。 –
您可以放大SVG而不会失去清晰度，但缩小无论是栅格图像还是矢量图像都会导致定义不准。 –
由于简单的nearest neighbor technique他们用来缩放图像，曾经的浏览器图像调整大小给了真正可怕的结果。现在他们通常在缩放时执行过滤，并且没有那在浏览器中调整大小和在Photoshop中调整大小的差异。
在将图像提供给客户端之前对图像进行缩放的真正优点是，您不会在不需要时下载大图像。根据图像的大小，这可以显着缩短页面加载时间。
最后要考虑的是越来越多的人拥有带“视网膜”显示器的设备。对于那些在服务之前缩放图像的用户，会导致图像不够清晰。
下面是各种浏览器中使用的图像缩放方法进行了深入的比较：http://entropymine.com/resamplescope/notes/browsers/
我认为这是自我解释是指这里什么调整大小。 – user1788175
这就是我说的'同样的事情'，其他人都明白这一点。 – user1788175