上传到服务器后，我的引导网站图像无法在移动设备上正确显示

Question

我用 bootstrao 制作了这个网站-andamios.cl 它在桌面上是完美的。我已经通过 chrome 的不同视口检查了它。它作为一个完整的响应式网站运行良好，但是当我将它上传到服务器并使用 iphone 和 ipad 访问该网站时。有些图像被拉伸，有些没有显示。但在 Android 设备上，我可以说几乎没问题（图片正在显示）但并不完美。 在PC上，它是完美的。 完成项目后，我还看到了一个水平滚动条。我的意思是页面右侧的一些空白区域。

我主要使用容器和容器流体。 我也使用了这个元标记-

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

我不确定是什么原因造成的。感谢您的帮助。

我正在添加一个图像未在 iphone 和 ipad 上显示的部分。

#banner {
    height: 100%;
    background: url('/Images/3.jpg')fixed;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
}

Answer 1

我通过在正文中添加 overflow-x: hidden 解决了空白问题

Answer 2

水平滚动条是您从右侧飞入的页脚表单。它应该被包裹在一个隐藏溢出的容器中。这样就解决了。

我没有看到任何拉伸图像（但我没有要检查的 iOS）。很抱歉。