背景图片在本地显示，但不在网络上显示

Question

我在图像上使用了css变换属性，以使其旋转（悬停时旋转180度）：

 .main-img:hover {
      transform: rotateY(-180deg);
  }

然后，我使用id添加了背景图片，以便当我的主图像悬停旋转时，背景图片可以在其后面看到：

#photo {     
  background-image: url("images/gauntlet2.jpg");
  background-size: cover;
}

page locally 当我在本地运行index.html时，所有内容都会完美呈现。当主图像旋转180度时，我可以看到背景图像；但是，当我从网上运行index.html时，它没有显示悬停背景，而是仅显示背景颜色。我已删除文件并将文件重新传输到我的站点，但是仍然存在差异。有谁知道为什么同一浏览器上的同一文件在本地和网络上呈现不同的原因。 page on the web