移动端背景图固定

移动端添加背景图，让背景图不跟随内容而滚动

body{
    width：100%；
    height:auto;
    background:url('1.png') no-repeat;
    background-size:100% 100%; 
    background-attachment：fixed;
    
}

background-attachment:fixed ;  固定背景图，不随内容滚动

 scroll： 跟随内容滚动

这样写完，问题就出来了，有个别安卓，和ios 不支持，这个属性

此时要做兼容

body:before {
  content: ' ';
  position: fixed;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: url(path/to/image) center 0 no-repeat;
  background-size: cover;
}

这样就可以了，

背景图的大小，也要做兼容处理

-webkit-background-size:  100% 100%;
    -o-background-size: 100% 100%;
    -moz-background-size: 100% 100%;

如果在背景图上加容器颜色，要使用background：rgba（）属性才可以显示背景图，而且要加background-size属性