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

我使用bootstra-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; 
}

来源

2017-08-09 Md.Rezwan Ferdous

你的URL不起作用 – JoostS

Ø遗憾。它应该是andamios.cl –

@JoostS你可以看看我的网站吧？ –

水平滚动条是从右侧飞入的页脚形式。它应该被包装在一个隐藏溢出的容器中。这将解决它。

我没有看到任何拉伸的图像（但我没有iOS来检查）。对不起。

来源

2017-08-09 22:27:57 JoostS

我解决了这个问题与ios通过 - https://stackoverflow.com/questions/36686654/fixed-background-images-disappear-on-iphone-ipad –

我已经添加了页脚在容器流体，但我添加overflow：隐藏，正如你所说的@joostS，但它没有解决右边的空白问题 –

它与隐藏在body上的overflow-x一起工作。 –

我加入解决了白色空间问题溢出-X：隐藏的身体

来源

2017-08-09 22:45:20

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

回答

相关问题