我对 CSS 有疑问。我必须将可变大小的图像适合宽度为 100% 和 96vh 的 div。在调整浏览器大小时它也应该看起来不错。我尝试了一些技巧，但结果一点也不好。这是一个例子:http://dev.tourday.co/tour/Test-Emir-tour/45 .该图像在 1366x768 分辨率下看起来确实放大了。
在这种情况下，我希望获得完全缩小时的结果(类似于 http://pokit.org/get/img/4445922ec2a29994b530d45759003d67.jpg )。
由于图片的纵横比与 div 的纵横比不同，我同意将边切掉一点，但我真的很想避免拉伸(stretch)。
尝试调整 width:100% 和 height:100%，然后拉伸(stretch) accours。我在这里缺少什么？
最佳答案
如果您将图像定义为其容器的背景图像，则可以使用 background-size: cover 。这将切断一些部分(取决于窗口比例)，但会填充整个容器并且不会扭曲图像比例。添加 background-position: center 确保始终显示中间部分。
关于html - Img 以适应 div 使用 css 不拉伸(stretch)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37279686/