CSS设置固定在Android手机上的背景图像？答案

【问题标题】：CSS to set background image fixed on android mobile phones?CSS设置固定在Android手机上的背景图像？
【发布时间】：2018-10-10 21:45:20
【问题描述】：

我在我的网站上设置了一个固定的背景图像，它在桌面和桌面上的所有浏览器上看起来都很好，但在安卓手机上它会平铺并重复它。我找不到解决这个问题的方法。这是代码..如果有人修复了保持背景图像固定而不在android Chrome上重复的方法，请告诉我..谢谢。请排除任何无济于事的 cmets。

CSS：

html, body {
    height: 100%;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    width: 100%;
    background-image: url("images/320htmlbackground.png");
    background-attachment: fixed;       
}

也试过了，但是没用.........

html { 
    background: url("images/320htmlbackground.png") no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

【问题讨论】：

标签： android css image background

【解决方案1】：

试试这个：

html, body {
    height: 100%;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    width: 100%;
    background-image: url("images/320htmlbackground.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;       
}

【讨论】：

【解决方案2】：

我刚刚遇到了类似的问题，但我不确定是否是同一个问题。我的问题是背景图像与您对固定图像的期望不同。 IE。当我上下滚动时，背景图像随页面移动。

原来我在body标签上设置了背景。除了在我的手机上，它在所有浏览器上都运行良好。我将背景更改为html 标签，当我滚动时它保持在应有的位置而不移动。

【讨论】：

【解决方案3】：

对我来说这很好用：

body{
    position: relative;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    @media screen and (max-width: 767px) {
        height: 100%;
        overflow-y: auto;
    }
}

【讨论】：