背景图像显示在实时服务器上，而不显示在Github页面上

Question

我的背景图片在实时服务器上运行完美，但在Github页面上却不显示。我读到Github页面区分大小写，您需要将.jpg更改为.JPG。完成此操作后，除背景图片外，其他所有图片均正常工作。这是代码行

.main-image {
    display: flex;
    justify-content: center;
    background-image: linear-gradient( to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) ), url("../images/st-george.JPG");
    height: 200px;
    background-size: cover;
    height: 97rem;
}

我也尝试过：

 url("/images/st-george.JPG")//Without the two dots before images "../images"

同样在实时服务器上有效，但在Github页面上无效。

当我尝试

 url("./images/st-george.JPG")//One dot instead of two

在实时服务器或Github页面上不起作用。

编辑：链接到我的gitgub页面：https://calebm5577.github.io/Orthodox-Church-Website/index.html链接到github代码：https://github.com/Calebm5577/Orthodox-Church-Website

Answer 1

从位于css stylesheet的css/style.css中显示为：

.main-image {
  display: flex;
  justify-content: center;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("./images/st-george.JPG");
  height: 200px;
  background-size: cover;
  height: 97rem; }

与the code on your repository匹配的

因此它试图从css/images/st-george.JPG中获取不存在的图像

如果将其更改为以下内容，它将起作用：

linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(../images/st-george.jpg)

您的文件名是st-george.jpg，不是 st-george.JPG