Bootstrap 背景图像在移动浏览器中是不同的

【问题标题】：Bootstrap Background Image Is Different Across Mobile BrowsersBootstrap 背景图像在移动浏览器中是不同的
【发布时间】：2015-04-27 17:12:41
【问题描述】：

我正在使用封面主题开发一个 Bootstrap 项目。我正在所有浏览器和屏幕尺寸上检查这个项目。在某些情况下，我的背景照片很棒并且可以滚动。在其他情况下，背景照片只是固定的，不会滚动。它的种植方式也不同。
这是我的代码：

html,
body {
height: 100%;
background: url('mccarran_pool.jpg') center center no-repeat;
background-attachment: fixed;
background-size:cover;
}

如何使这个跨浏览器友好且响应迅速？

【问题讨论】：

标签： css mobile cross-browser

【解决方案1】：

你应该 -webkit- 和 -moz- 因为在某些浏览器中它不起作用。试试这个：

html,
body {
height: 100%;
background: url('mccarran_pool.jpg') center center no-repeat;
background-attachment: fixed;
-webkit-background-size:cover;
-moz-background-size:cover;
background-size:cover;
}

【讨论】：

谢谢，我试过了。它仍在裁剪图像而不是显示完整图像。我也试过background-image: 100%; background-image: 100% 100%: background-image: auto: background-image:contain; background: url('mccarran_pool.jpg'); background-size: cover;这些都不起作用
相反，我应该说整个图像仍未显示在目标网页上。您必须向下滚动才能看到底部，而不是在视口中查看整个内容。
OK.. 你想完整显示.. 试试这个背景尺寸：100% 100%;而不是 background-size:cover;