1.object-fit 属性

设置好图片的宽高，然后设置object-fit属性为contain就是常见的图片自适应效果。

img {width: 400px;height: 400px;object-fit: contain;}

object-fit: fill|contain|cover|scale-down|none|initial|inherit;

2.background

我们把图片作为背景，然后用background-size属性进行调节

.img-container{width:688px;height:304px;background: black url(./test.png) no-repeat center center;background-size: contain;}

本文转自链接：https://www.jianshu.com/p/78e4a240370c