html - 图像未通过 css 显示

Question

我正在尝试为我的网站设置封面照片。我通过 CSS 使用“背景图像”来链接图像。

我通过 css 图像链接的其他照片也没有出现。

我很肯定本地路径是正确的。（照片位于“网站名称”[index.html 所在位置]/resources/photos/cover.jpg）

奇怪的是，当使用相同的路径通过 HTML 链接时，图像会正确显示。

CSS：

.cover{
    background-image: url(../resources/photos/cover.jpg);
    height: 34.3rem;
    min-height: 100%;
}

HTML：

<div class="cover">
    <div class="summary">
        <span style="width: 80%;">Delightful Days Daycare
            <p>Where everyday is delightful!</p>
        </span>
    </div>
</div>

标签： htmlcss

Answer 1

您应该在检查器中找到图像并右键单击open in new tab并检查图像是否加载。如果 URL 正确与否，您还可以查看完整的 URL 路径并更好地调试。如果它加载它是代码的问题，如果没有检查 URL 并将其与您的文件夹结构匹配。