html - CSS 背景图片将在本地显示，但不会在 gh-pages 上显示，收到 404 错误

Question

最近我试图通过在下面的“介绍”类中添加背景图片来更新我的投资组合。我通过 CSS 添加图像，当在 Chrome 中本地打开我的投资组合时，图像显示正确。但是，在提交我的更改然后向上推送到我的 gh-pages 后，背景图像不再显示。相反，我留下了:

Failed to load resource: the server responded with a status of 404 (Not Found) http://jlquaccia.github.io/jq-design/img/swirl_pattern.jpg

有人可以帮忙吗？我觉得我以前做过这件事，没有遇到任何问题。我还假设这应该是一个简单的解决方法。我的代码如下:

HTML

<section class="intro">
        <h1 class="intro-title">{ Hello, I'm Jason Quaccia. <br> an aspiring Bay Area based Front-end Web <span class"dev-design">Developer</span> &#38; <span class"dev-design">Designer</span> }</h1>
        <div class="down-arrow">
            <a href="#about"><img class="down-arrow" src="./IMG/arrow-203-32.png" alt="Down Arrow"></a>
        </div>
    </section>

CSS

.intro {
    height: 35em;
    background: url(../img/swirl_pattern.jpg);
}

Answer 1

URL 区分大小写，您指向:http://jlquaccia.github.io/jq-design/img/swirl_pattern.jpg但你应该指向 http://jlquaccia.github.io/jq-design/IMG/swirl_pattern.jpg相反(注意大写的 IMG)

所以你的 CSS 应该是这样的:

.intro {
    height: 35em;
    background: url(../IMG/swirl_pattern.jpg);
}

(注意你是怎么做到箭头的)