Css 调整图像大小而不扭曲图像

目前，我正在使用下面的代码执行一个非常简单的方法

<div style="width: 100%;">
    <img width="100%" height="250" src="http://i.imgur.com/lNB7QSt.jpg">
</div>

如果我删除代码的

height=“250”

部分，它会将图像打印为正常质量+正常大小，我希望它的高度限制为250，并返回类似于此图像的内容

但它返回的内容与下面显示的内容类似

---

问题在于将宽度设置为100%。尝试删除width=“100%”，或根据纵横比手动设置宽度。

您只需对CSS宽度属性使用“auto”，如下所示：

<img style="width:auto; height:250px" src="http://i.imgur.com/lNB7QSt.jpg">

---

这应该符合您的期望。

使用我在评论中的链接中的信息

img{
显示：块；
最大宽度：230px；
最大高度：250px；
宽度：自动；
高度：自动；
}

。图像名称{
显示：块；
最大宽度：100%；
最大高度：250px；
}
.image-name2{
显示：块；
宽度：自动；
最大宽度：100%；
最大高度：250px；
}

上面是没有质量变化的图像+您正在寻找的宽度。
下面是您要查找的高度，但宽度与正常图像相同的图像。
这是我能想到的唯一明智的方法（使用
背景尺寸：封面
）。您可能可以使用现有的标记做一些棘手的事情，但我觉得它不会给您留下任何足够灵活的东西


.frame{
高度：250px；
背景：透明无重复中心；
背景尺寸：封面；
}
我已经把你的问题读了三遍，仍然不明白你在问什么。因此，如果我理解正确，你只希望保持纵横比，而不裁剪图像？我在这一点上有点像@j08691。。仍然困惑。@Spyder_说“嗨，是的，这就是我想要的……这不是你想要的吗？”？可能你可以尝试最大高度：250和宽度：自动他们希望它裁剪到图像的中心。我也这么认为。不，我不这么认为。。。该问题有一个缩放图像的示例。没有修剪。OP似乎不太懂技术。他们足够精明，能够准确地裁剪出他们想要显示的图像，而且它也非常接近图像的中心。也许
这样，如果图像高度低于250像素，它就不会被扩展（=看起来很差）