Css插入背景图片并且填充满整个容器

1、首先插入背景图：

background-image: url(图片地址);

2、使得图片填充整个容器：

background-size: cover; 

需要注意的是，被填充的容器要预先设置宽高。

                                                                                         华丽丽分界线                                                                                            

background-size使用语法有下面四种情况

background-size: length|percentage|cover|contain

length用法：

background-size:100px；  //背景图片显示的宽和高为100像素

background-size:100px  160px；//背景图片显示的宽为100像素，高为160像素

percentage用法：

background-size：60%； //背景图片的显示宽度和高度是图片大小60%；

background-size：60%  80%； // 背景图片的显示宽度是图片大小的60%，高度是80%；

cover用法：

background-size：cover；  //把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。

contain用法：

background-size：contain； //把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。

扩展资料

background-size属性浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。