我在这个网站上有一个我在其他任何地方都没有看到的呈现错误。该网站在所有现代浏览器中呈现并验证正常，但我不明白为什么它不显示完整的背景图像(见下面的屏幕截图)。我正在使用 Yahoo CSS Reset，背景图像在正文中声明如下:
background: url("back.jpg") #033049;
您也可以访问网站:http://xaviesteve.com/
如果我需要提供更多详细信息，请告诉我。 感谢您提供任何帮助/提示，谢谢。
编辑
我发现很少有人在 Internet 上报告此问题:
另一个 SO 问题:White space showing up on right side of page when background image should extend full length of page建议申请
overflow-x:hidden但它会裁剪网站。在 iPad 论坛中:http://www.ipadforums.net/ipad-development/9954-mobile-safari-doenst-show-background-image-when-page-slided-left.html没有回复
解决方案
我一直在调查并尝试不同的方法来解决这个问题，发现将背景图像添加到 <html>标签修复了问题。希望这可以为其他开发者节省一些时间。
之前
body {background:url('images/back.jpg');}
之后
html, body {background:url('images/back.jpg');}
最佳答案
将样式移动到 html 元素可以正常工作，但还有其他方法可以解决此问题。
这里发生的事情是 body 元素最初是根据视口(viewport)调整大小的。如果视口(viewport)只有 X 像素宽，即使包含的内容更宽，您的正文也只有 X 像素宽。要解决此问题，请为您的 body(或任何您附加背景样式的内容)提供基于非百分比的 width 或 min-width 以适合您的内容。
通过缩小浏览器窗口并向右滚动，您实际上会在桌面浏览器上遇到同样的问题。这个问题在 iPhone/iPad 上更为明显，因为默认情况下，Mobile Safari 会将视口(viewport)设置为 980 像素，然后缩小直到所有内容都适合屏幕。
我不推荐的替代解决方案是使用以下方法自行设置视口(viewport)宽度，因为它仅适用于 Mobile Safari:
<meta name = "viewport" content = "width = 1080">
更多信息请访问 Apple's Developer Docs .
关于html - 网站正文背景在 iPhone Safari 中呈现右白边距，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5804441/