Question

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

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

网址区分大小写，您指向：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);
}

（注意你是如何正确地做箭头的）

CSS背景图像将在本地显示但不在gh页面上显示，接收404错误

1 个答案: