我想给我的网页背景，所有元素都将在上面，所以我把它添加到我的CSS文件中：
body {
background: url("../img/pic.jpg") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
它在网络浏览器上也能正常工作。背景图像的位置是固定的，在滚动时，只有body标签中的元素会移动，但图片不会移动。
但这对手机不起作用。。。当我在手机上打开它时，会显示相同的背景图片，但放大了几次，它的大小不会像我在电脑上缩小网络浏览器以在较小的屏幕上查看预览时那样好。
我试了几张照片，大的，小的，不同的比例，但都无济于事。我甚至添加了
@media screen and (max-width: 479px) {
body {
background: url("../img/pic.jpg") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}}
所以我可以在移动设备上显示一张特殊的照片，但无论我选择/上传哪张照片，它总是会随着变焦而失真。
我正在使用引导程序，并且仍在学习。我使用了一些模板中的一些库存文件，但在其中搜索，希望找到一个CSS，它覆盖了我自己的身体CSS并放大了图像，但找不到任何文件。呵呵
在许多操作系统上，手机固定后台工作不好。所以试试这个：
background-attachment: initial;
或者使用body:before设置背景。此处提供更多解决方案：背景：固定无重复不工作在移动
试试这个解决方案：
@media(max-width: 767px) {
body {
background-size: 100%;
background-attachment: initial;
background-position: center;
background-repeat: no-repeat;
}
}
您的问题可能出现在@media标记的声明中。它应该是@media(max-width: 767px)。