Bootstrap 手机背景图片

Question

我有一个背景图片集。当我在移动设备上查看时，不同页面上的背景图像大小不同，即使它们都使用此代码链接到相同的样式表

站点是 'treyscode.com' 您可以转到不同的页面并查看大小差异。页面还没有完成所以不要给我太多时间:)

'''

body {
  background: url(../image/blackhole.jpg);
  background-repeat: no-repeat;
      background-position: center;
      background-attachment: fixed;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      height:100%;
      width:100%;
}

'''

为什么不同的页面会显示不同大小的背景图片？

Answer 1

实际上，这取决于您将 background-repeat 属性设置为 no-repeat 的 webpage.As 的内容，所以它让您认为它的大小不同。实际上，图像是不断粘贴的，并且每一页上的图像大小都相同。

如果你删除上面的 background-repeat 属性那么你可以看到我所说的不同。

Bootstrap 手机背景图片

Bootstrap Mobile background image

css

mobile

background-image

bootstrap-4