背景图片大小(background-size)cover、100%和contain的区别

三者都是来定义背景图显示尺寸大小的,三者之间的区别:

cover:是按照等比缩放铺满整个区域。优点:图片不会变形。 缺点:如果显示如果显示比例和显示区域的比例相差很大某些部分会不显示,比如长度比宽度大很多,则宽度左侧会有一部分不显示。

100%:长宽100%显示,可能会拉升图片导致图片变形。

contain:也是等比缩放,按照某一边来覆盖显示区域的,会有白边

你可能感兴趣的:(css,css3,css,html)