图片

object-fit和object-position里面都出现了object，这个object是什么呢？多方了解(MDN)，其实这个object是指的替换元素(Replaced element)

比如image,嵌入的文档(iframe之类)或者applet,叫做替换元素。比如,img元素的内容通常会被其src属性指定的图像替换掉。替换元素通常有其固有的尺寸:一个固有的宽度,一个固有的高度和一个固有的比率。

object-fit

object-fit：fill

整个图片将完全填充此框。 如果对象的高宽比不匹配其框的宽高比，那么该对象将被拉伸以适应；

object-fit:contain

图片保持自身的宽高比；

object-fit:cover

图片保持自身的宽高比，同时填充元素的整个内容框。 如果图片的宽高比与盒子的宽高比不匹配，该对象将被剪裁以适应；

object-fit:none

图片尺寸不会被改变；

object-fit:scale-down

最终呈现尺寸比较小那个；

object-position

设置元素的位置如

object-position: 50% 50%;
object-position: right top;
object-position: left bottom;
object-position: 250px 125px;

原文：https://www.cnblogs.com/ranyonsue/p/9367423.html