首页 > 解决方案 > 背景图片已加载但未显示

问题描述

我在这里可能是白痴。我一直在尝试让 jpeg 图像加载到部分元素的背景中,作为我正在做的引导课程的一部分(对于这个网络开发的东西来说很新)。图像在 Firefox 检查器中加载正常 - 如果我将鼠标悬停在链接上,它不会显示任何错误并显示图像 - 但它只是没有显示在页面上。

以下是相关代码:

<secton id="cover">
    <div id="cover-caption">
        <div class="container">
            <div class="col-sm-10 sm-offset-1"></div>
            <h1>Generic website title</h1>
        </div>
    </div>
</secton>

CSS:

#cover{
    background: url("Assets/Photos/Blanket.jpg") center center no-repeat;
    background-size: cover;
    text-align: center;
    height: 100%;
}

图像的路径和名称肯定是正确的,所以不是这样。

有任何想法吗?

标签: htmlcssbackground-image

解决方案


解决它!正如所料,发布后立即。

显然将高度设置为 100% 是问题所在。将其更改为 100vmin 会有所不同。

婴儿步...


推荐阅读