Question

我在向自举网站添加背景图片方面遇到了很大麻烦。我试图使用stellar.js创建一个视差网站到目前为止网站工作正常，我在每张幻灯片上有一些文字，链接滚动到正确的幻灯片等等...但图像似乎不会加载。我已经浏览了这个网站，youtube和其他许多人，但我似乎无法让混蛋图像显示lol

我在以下文件夹中获得了背景图片。 img / slide1bg.jpg所以它只有一个目录。也许我错过了一些东西，但我试图用here:和引导程序将tutoiral组合在一起......以下代码适用于背景图像，但在引导程序中它似乎不喜欢它。

我的HTML：

<div class="slide" id="slide1" data-slide="1" data-stellar-background-ratio="0.5">
    <div class="container">
        <div class="slidetext">
            //text here
        </div>
    </div>
</div>

我的CSS：

html, body{
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}

.slide{
position: relative;
background-attachment: fixed;
width: 100%;
height: 100%;
}

#slide1{
color: pink;
background: url('./img/slide1bg.jpg') no-repeat;
background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}
.slidetext{
padding-top: 70px;
}

Answer 1

您是否尝试在网址的开头添加一个点（。）？

这是您输入的内容：

background: url('./img/slide1bg.jpg') no-repeat;

试试这个

background-image: url('../img/slide1bg.jpg') no-repeat;

带有视差的bootstrap 3.1.1中的背景图像问题

1 个答案: