无法显示背景图片

Question

我有以下 div:

<div class="col-lg-5 ml-lg-auto">                            
    <div class="image-container">
        <img class="table-img" src="/img/home.png" alt="">
    </div>
</div>

基本上我想在 .image-container 中显示背景图像，所以我创建了以下内容 class:

.image-container {
    height: 100%;
    width: 100%;
    background-image: url(../img/car.png);
}

文件夹结构如下所示：

/ source
    / img
    / css

当我检查 .image-container 时，我得到了正确的 url 并且当我在新的 window 中打开它时，我可以看到该文件，如果我在这里指定 background-image: url('https://somesite.com/image.png'); 显示了容器中的图像，所以看起来像是一个相对的 url 问题，但我在这里看不到问题。

Answer 1

最有可能的问题是 .image-container 的 height 设置：它是 100%，但什么是 100%？如果父容器没有定义高度，并且 div 本身没有内容，则其高度将为 0，因此您将看不到任何内容。要尝试是否适用，请将 height 设置为固定像素值。如果您随后看到背景图片，问题肯定出在 height 设置上。

无法显示背景图片

Cannot display background-image

css

background-image

bootstrap-4