html - 为什么背景图片不显示在页脚中？

Question

如下图所示，我的页脚的 footerImage div 的背景图片没有显示，即使有明确定义的高度 (50px) 和宽度 (100%)绿色边框所示的 div。为什么？我该如何解决这个问题？

注意:这不是图像路径问题，因为我可以在 Brackets 中调出图像的预览。

我的页脚:

HTML:

<ul>
    <li>
        <a href="" target="_blank"> <figure>
            <div class = "footerImage resume"> </div>
            <figcaption>Resume</figcaption>
        </figure></a>
    </li>
</ul>

CSS:

.footerImage {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    width: 100%;
    height: 50px;
    border: 1px solid green;
}

.footerImage .resume {
    background-image: url('../images/resume.png');
}

Answer 1

为你的 div 编辑这个 css

.footerImage.resume {
    background-image: url('../images/resume.png');
}

因为它们都是同一个 div 的类，所以它们在 .footerImage 和 .resume 之间应该没有间隙