Bootstrap 不同移动浏览器的背景图片不同

Question

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

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

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

Answer 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;
}

Bootstrap 不同移动浏览器的背景图片不同

Bootstrap Background Image Is Different Across Mobile Browsers

css

mobile

cross-browser