Question

我在尝试将背景图片上传到正在构建的页面时遇到问题。

我正在使用Bootstrap，并且已经使用自定义类创建了一个div。我想使用CSS添加背景图片，但是无法正常工作。这是我写的代码

.homeinner {
  background-image: url("/.../../name.jpg");
  height: 100%;
}

<div class="homeinner">
</div>

打扰一下，如果这个问题看起来太天真了，我是编码的新手，在写这篇文章之前，我尝试了数小时的不同解决方案。

问题不在于图像的大小或比例：根本不显示:(

能请你帮我吗？

Answer 1

在您的CSS代码中，您所指向的图像是域的根目录上方两步。

folder 1/  <-- This is the folder the image needs to be in with your current CSS
└─ folder 2/
   └─ domain/

请注意，这仅在文件由实际域提供时才可行。否则，前导/指的是计算机/服务器中磁盘的根目录，随后的../../将尝试增加2个目录（进入空目录或某些目录，这是不可能的）。 / p>

基于提供的文件结构，在此答案的底部，您应该能够仅使用从CSS文件到图像本身的相对路径（不带前导/）。以下CSS应该可以解决

.homeinner {
  background-image: url("../img/name.jpg");
}

这会将一个目录上移到文件夹assets（../部分），并引用文件夹name.jpg中的图像img。

注意：此路径没有斜杠/。这就是为什么将其称为相对路径的原因，因为它的原点是CSS文件所在的位置。

文件夹结构：

root/
└─ assets/
   ├─ index.html
   ├─ img/
   |  └─ name.jpg
   └─ css/
      └─ index.css