JavaScript/HTML : How do I display an IMG with a set dimension and if the image is wider or taller than that dimension, 裁剪/ overflow hidden ？

Question

我有一堆保证有的图片:

• 最小宽度 = 200 像素
• 最大宽度 = 250 像素
• 最小高度 = 150 像素
• 最大高度 = 175 像素

我想要做的是显示一个由 200 像素 x 150 像素组成的图像矩形，同时保持比例(不拉伸(stretch)或收缩)。

这意味着，我可能有一些溢出。

如何显示图像，使其保持原始图像大小的比例，同时显示在 200x150 像素的窗口内并隐藏任何溢出？

Answer 1

用您想要的尺寸和overflow: hidden将它们包裹在容器中。