css - 背景图片不会在平板电脑和手机上显示

Question

背景图片在 PC 和模拟器(平板和手机)上完美显示，但不会在实际手机/平板上显示。

代码

div#photo_break {
  @include viewport-unit(height, 28vw);
  background-image: url('<img>');
  background-repeat: no-repeat;
  background-size: 100% auto;
  -webkit-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-position: center top;
  background-attachment: fixed;
  z-index: 99999;
}

website

正如您在这张图片中看到的，在 Chrome 模拟器中显示了图片。

图像的大小不是真的很大，是吗？

Answer 1

不错的网站。 :D 让我们尝试解决您的问题。

确保您没有在任何媒体查询中包含该 CSS 代码，因为它可能会阻止该内容。

您还可以尝试使用与移动设备相同的 CSS 添加新的媒体查询，例如 @media (min-width: 481px) { }。

再次加载网站之前，请清理您的移动浏览器的缓存。