CSS3笔记-一个自适应的背景

html:

<div class="xx"></div>

css:

div{
background:url(images/img.jpg) no-repeat center;
background-size:cover;
}

cover是保持背景图像本身的宽高比例，并将图片缩放到正好完全覆盖所定义的背景区域。

background-size还有其它属性：

contain：保持背景图像本身的宽高比例，并将图片的高度或宽度正好适应所定义的区域。

<length>:浮点数和单位标识符组成的长度值，不可为负。

<percentage>:0%-100%，不可为负。