html - CSS - 文件重命名和重定位后标题背景图像不显示

Question

我在不同的位置和不同的文件名下启动了这些文件。我决定我喜欢我所拥有的，所以我将文件名更改为对元素更永久的名称，并将它们移动到另一个文件夹。从那时起，我的标题图片将不会显示。

所有标记和 CSS 代码都反射(reflect)了新的文件名和位置，页面布局中的其他所有内容都像以前一样呈现。仅缺少标题图片。

有没有人看到我忽略的代码中的某些内容？

HTML

<div id="headerbox">
        <header>
            <h1>Southern Draw Archery of Coweta</h1>
        </header>
       </div>`

CSS

#headerbox {background-image: url("images/archery.jpg");
        background-position: center;
        background-repeat: no-repeat;
        left: 200px;
        right: 200px;
        top: 0px;
        height: 200px;
        position: absolute;}

#headerbox header {position: absolute;
               bottom: 0;
               left: 0;
               width: 100%;
               padding: 20px 10px;}

#headerbox header h1 {margin: 0px;
                  color: white;
                  text-shadow: 2px 2px black;
                  position: relative;}

--------下面评论的快速编辑--------

css 和图像都在各自独立的文件夹中，而 HTML 文件在主(根)元素文件夹中。所以文件结构是这样的:

主元素文件夹 /\ css 文件夹 图片文件夹 /\ css文件图像文件

我已经尝试将图像源移动到 HTML 标记并且图像确实显示出来了，但是其余的 css 设置不适用于它。在我移动所有内容之前，所有代码都按照预期呈现，如下所示。

Answer 1

您的 CSS 文件是否在单独的文件夹中(即与 HTML 文件不在同一层级)？

然后 {background-image: url("images/archery.jpg") 应该改为 {background-image: url("../images/archery.jpg") 或类似的