1.自适应(只有一张且图片不变形,图片可能显示不完整)
.login_back{
position: absolute;
width: 100%;
height: 100%;
background-image: url(../img/background.jpg);
background-repeat: no-repeat;
background-size:cover; /* 让背景图基于容器大小伸缩 */
background-attachment:fixed; /* 当内容高度大于图片高度时,背景图像的位置相对于viewport固定 (这里已经相对body设置了高度,宽度,所以这句话可有可无*/
}
2. 纵向或横向拉伸铺满,图片变形,显示完整
.login_back{
position: absolute;
width: 100%;
height: 100%;
background-image: url(../img/background.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
background-attachment:fixed; /* 当内容高度大于图片高度时,背景图像的位置相对于viewport固定 */
}