您可以尝试CSS3 object-fit
，并查看浏览器支持 表 。
CSS3
object-fit/
object- position指定对象（图像或视频）在其框内的放置方式的方法。对象适合选项包括“包含”（根据宽高比适合），“填充”（拉伸对象以填充）和“覆盖”（溢出框但保持比例），其中对象位置允许对象重新定位，如背景-图像呢。
**[JSFIDDLE DEMO](https://jsfiddle.net/k7h1xvr7/)**
.container { width: 200px; height: 200px; }.object-fit-cover { width: 100%; height: 100%; object-fit: cover; }<div > <img src="https://i.stack.imgur.com/UJ3pb.jpg"></div>
