CSS background-size ：contain与cover区别

cover和contain都是用图片覆盖背景区域

background-size: contain

background-size: cover

在no-repeat的情况下：

cover不会留白，如果容器宽高小于图片的宽高，会把多余的部分截掉。

也就是容器高度超过图片原有比例，图片的宽会缺失，通俗点讲，就是图片右边会少一部分；反之，容器高度小于图片原有比例，图片下面会有一部分看不见；容器宽度超过图片原有比例，图片下面会有一部分看不见；反之，容器宽度小于图片原有比例，图片右边会少一部分。

contain属性,容器宽大于图片宽，那么图片的右边会留白；如果容器高大于图片高，那么图片下面会留白。

参考文章：https://blog.youkuaiyun.com/qq_59281339/article/details/126548608