Html 未显示div背景图像

我知道这个问题在这里被问了很多次，但我所读到的都不管用

我在CSS中使用这个：

div.main {
    background-image: url("[DIRECTORY HERE]");
    position: absolute;
    text-align: center;
    top: 150px;
    left: 485px;
    height: 530px;
    width: 775px;
    z-index: -1;
}

然后我用HTML调用它，如下所示：

<div class = 'main'>
        <!-- <img src = '[DIRECTORY HERE]'> -->
            <p id = 'content'></p>
        </div>

正如你所看到的，我只是在使用img标签，但我发现这是一种低效/无效的处理方式

---

我不知道我做错了什么。我已经尝试了我在这里读到的每一个答案，但没有任何效果。

我认为这应该有效

CSS:

---

我刚刚从“div.main”中删除了“div”

您可以使用以下任一选项：
选项1
CSS:

.main {
    background-image: url("[DIRECTORY HERE]");
    position: absolute;
    text-align: center;
    top: 150px;
    left: 485px;
    height: 530px;
    width: 775px;
    z-index: -1;
}

<div class = 'main'>
        <!--<img src = '[DIRECTORY HERE]'>--> 
        <p id = 'content'></p>
</div>

div {
        background-image: url("[DIRECTORY HERE]");
        position: absolute;
        text-align: center;
        top: 150px;
        left: 485px;
        height: 530px;
        width: 775px;
        z-index: -1;
    }

<div>
    <!-- <img src = '[DIRECTORY HERE]'> -->
    <p id = 'content'></p>
</div>

HTML:

.main {
    background-image: url("[DIRECTORY HERE]");
    position: absolute;
    text-align: center;
    top: 150px;
    left: 485px;
    height: 530px;
    width: 775px;
    z-index: -1;
}

<div class = 'main'>
        <!--<img src = '[DIRECTORY HERE]'>--> 
        <p id = 'content'></p>
</div>

div {
        background-image: url("[DIRECTORY HERE]");
        position: absolute;
        text-align: center;
        top: 150px;
        left: 485px;
        height: 530px;
        width: 775px;
        z-index: -1;
    }

<div>
    <!-- <img src = '[DIRECTORY HERE]'> -->
    <p id = 'content'></p>
</div>

HTML:

.main {
    background-image: url("[DIRECTORY HERE]");
    position: absolute;
    text-align: center;
    top: 150px;
    left: 485px;
    height: 530px;
    width: 775px;
    z-index: -1;
}

<div class = 'main'>
        <!--<img src = '[DIRECTORY HERE]'>--> 
        <p id = 'content'></p>
</div>

div {
        background-image: url("[DIRECTORY HERE]");
        position: absolute;
        text-align: center;
        top: 150px;
        left: 485px;
        height: 530px;
        width: 775px;
        z-index: -1;
    }

<div>
    <!-- <img src = '[DIRECTORY HERE]'> -->
    <p id = 'content'></p>
</div>

图像是问题所在。链接无法工作，因为它指向计算机上的图像。您需要在线上传图像并使用http://或通过删除http://指向文件夹。如果您在线编辑css（而不仅仅是在您的计算机上），那么您需要确保图像是可访问的

因此，基本上可以选择以下任一项： 在线上传到自己的url:
背景图片：url（“[此处目录]”）

使用文件夹：
背景图片：url（“[此处目录]”）

---

否则一切都好。祝你好运

为什么这会有什么不同？如果你填充了标签，你能看到它的内容吗？您是否需要“z-index:-1；”setter？请完成您的问题，使其包含以下内容：资源文件是否位于正确的目录中？开发工具（元素检查器）是否显示预期的URL？您是否已在开发人员工具/调试器中检查是否实际找到了资源文件（例如，200响应）？包含背景图像的HTML元素或图像元素本身是否足够大（通过元素检查器检查）/是否被其他元素遮挡/是否隐藏？图像通常在浏览器中可见还是已损坏？@Eraph是的，我通过jQuery语句填充它，但它不会导致背景图像工作。我也独立填充了它，但没有成功。@Xufox嗯。。。古怪的我进入Inspector，单击div元素。在该元素的CSS中，它排除了背景图像，删除了高度和宽度。为什么会这样？如果你把它设为素色，你能看到DIV吗？e、 g.背景色：#00ff00；Ps：下面是一个使用css方法从在线托管的图像添加背景图像的工作图像示例：.main{background image:url（“）；}