background-size属性的使用方法

CSS中background-size属性的使用方法

CSS里的background-size属性能够决定如何在指定的元素里展示。可以随心所欲的控制背景图片的大小。
background-size的语法：

background-size有几个预定义的值，但也可以像其它size属性一样使用数字：

contain: 包含，整个背景图都要被包含在元素内，没有超出的部分。

cover: 覆盖，背景要覆盖元素的所有区域，不能有空白出现。

长度/百分比: 数字值
使用"length"|"percentage"时，第一个值是指背景图像的width，第二个指背景图像的height，如果只有一个值，height就为auto

使用percentage注意：width和height是针对于背景区域，不是背景图像大小。

cover:背景图像缩放,保留图像原有的比例/长宽比,不管背景图像大于还是小于背景区域，都会覆盖背景区域,图像的宽度或高度等于或超过背景区域,再次,根据背景图像的比例是否匹配的背景区域,背景图像的某些部分可能不在背景区域内。

contain:背景图像缩放,同时保留图像原有的比例/长宽比,无论是图像的宽度或高度超过背景区域,以尽可能大的覆盖背景区域。因此,根据背景图像的比例是否匹配背景区域,可能会有一些背景图像覆盖不到背景地区