
background-attachment: fixed的效果非常不错,当背景设置了这个属性,内容滚动时,背景定位在那里不动,有点视差效果的感觉。但是,此方法在IOS下无效:
body {
background-image: url('../img/background.png');
background-position: center;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
}上面的background-attachment: fixed在安卓手机下完美,但是在IOS手机下,滑动内容,发现背景跟着一起滑动,完全不起作用。此时,可以使用下面的方法来达到类似的效果,至于body的背景则不需要了:
body:before {
content: ' ';
position: fixed;
z-index: -1;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-image: url('../img/background.png');
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}