调整HTML图像的缩放比例

Question

在Chrome和Firefox上，my site（右下角）上的卡片图像显示不同。在Chrome中，它的比例被保留，但比例在Firefox中扭曲。

如何申请图像本身的不断调整大小，跨浏览器（基本上做到现在情况如何针对Chrome）

Answer 1

理想情况下，您希望避免允许浏览器调整图像大小。不同的浏览器可以达到不同的质量水平，这与您通过专用数字图像编辑器（Photoshop，Paint.NET等）可以实现的效果无法比拟。最好在发布之前将其调整到所需的尺寸，然后以像素为单位显式设置实际的高度和宽度。

Answer 2

你有你的图片标签以下内容：

width="100%" height="40%" 

尝试只指定其中一个（我会建议宽度）以保持纵横比，否则图像将以某种方式拉伸或挤压，以适应不那么体贴的浏览器上的这些尺寸。