html背景图片不重叠铺满,html中背景图片铺满页面没有重复的效果

刚开始设置背景图片的时候，能铺满页面，但是没有全部把页面展现出来，经过一番查资料，才搞明白。如下：

background: url(../../../assets/login/login-background.jpg) no-repeat center 0px;

background-position: center 0;

background-size: cover;

设置这三个属性就可以达到你想要的效果，其实background属性是包括下面两个属性的，如果background属性里面没有设置的话就加上，设置了话就不用了。

如果图标高度有问题，加上下面这个：

min-height: 100vh;

详解：

url(../../../assets/login/login-background.jpg) —— 图片路径的位置

no-repeat                                                      —— 图片不重复

center 0px                                                     —— center是距离页面左边的定位，0px是距离页面上面的定位

background-position: center 0                      —— 就是图片的定位，同上

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

min-height: 100vh;                                        —— 视窗的高度，“视区”所指为浏览器内部的可视区域大小，即window.innerWidth/ window.innerHeight大小