javascript - 网站上的标题图片在手机上不显示，是什么问题？

Question

我创建了一个个人网站，它有一个标题图片，在谷歌浏览器中测试移动响应时，它可以扩展屏幕的宽度，它似乎工作得很好，但在移动设备上部署和查看后，图像似乎没有显示.有人可以看看这是为什么吗？网站托管在 robbiechastain.com

这是 CSS:

.hero {
  position: relative;
  background: url("images/laptop.png") no-repeat bottom fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  text-align: center;
  color: #fff;
  padding-top: 110px;
  min-height: 500px;
  letter-spacing: 2px;
  font-family: "Montserrat", sans-serif;
}

Answer 1

显然 css 没有任何问题，导致它看起来没有显示的原因是 laptop.png 图像的大小是否很大(2.2mb)或者因为网络连接导致图像花费更长的时间加载。

无论如何，您应该始终减小图像的大小以提高网站性能