1

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

的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;
}
4

3 回答 3

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;       
}
于 2013-07-02T00:41:20.557 回答
0

我只是遇到了类似的问题,但我不确定它是否相同。我的问题是背景图像与您对固定图像的期望不同。即当我上下滚动时,背景图像随页面移动。

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

于 2015-01-28T12:43:43.063 回答
0

对我来说,这很好用:

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;
    }
}
于 2018-10-10T13:45:20.277 回答