背景中心在PC上，但不在移动设备上

Question

我无法让我的网站在移动设备上正常显示

以下是我在CSS中使用的代码，这也是我希望它在移动设备上执行的操作：

html {  
  background-image: url(/wp-content/themes/Newstyle/images/bg.jpg), url(/wp-content/themes/Newstyle/images/bg-repeat.jpg);
  background-attachment: scroll, scroll;
  background-color: #000;
  background-repeat: no-repeat, repeat-y;
  background-position: center top, center top;
}

html, body {
  width:100%;
  height:100%;
}

我不知道我做错了什么，我尝试了几个修复，但我无法使它工作。有人可以帮忙吗？以下链接。

My website - http://renoized.com

Answer 1

您可以尝试：

背景尺寸：封面;

或

使用图像而不是背景，使用绝对定位和z-index值-999。由于iOS不支持100％宽度的背景图像。

Answer 2

我用来解决这个问题的方法是this，无论它有多优雅或不优雅，我都很高兴它有效。

我所要做的就是从这里复制CSS：

html {  
  background-image: url(/wp-content/themes/Newstyle/images/bg.jpg), url(/wp-content/themes/Newstyle/images/bg-repeat.jpg);
  background-attachment: scroll, scroll;
  background-color: #000;
  background-repeat: no-repeat, repeat-y;
  background-position: center top, center top;
}

到我的内容容器标记，在我的例子中是#page。

这样做是为了让内容在正确的位置具有自己的背景。它还解决了我在.desktops上遇到的问题，如果您的设备宽度小于内容<div>

，背景会移动