无法加载背景图片

Question

我观看了一个Youtube视频，该视频教了如何创建网站的目标网页，因此我尝试使用CSS设置背景，而该背景不会加载。

#showcase {
    background-image: url('..img/showcase.jpg');
    background-size: cover;
    background-position: center;
    height: 100vh;
}

背景仍然空白。

Answer 1

您当前使用的文件路径不正确。使用以下内容：

../img/showcase.jpg

我们在/之后添加了一个简单的..

当要导入的文件与文件导入位于同一文件夹（即子文件夹）时，我们使用./。当要导入的文件是文件导入之前的一个目录时，使用../，依此类推。

Answer 2

在文件根目录的img文件夹中是否有“ showcase.jpg”？

如果这看上去很令人困惑，请在与css文件相同的文件夹中移动Showcase.jpg图像，并将css中的路径设置为

background-image:url('showcase.jpg');

Answer 3

文件路径..img/showcase.jpg取决于css文件和图像文件的位置。

..img/showcase.jpg是错误的，也许您需要使用'../img/showcase.jpg'，这意味着：图像相对于css文件的父文件夹内img文件夹中的css定位。 / p>

如果您很难找到正确的相对路径，请尝试在线使用ti工具： https://www.stevebreese.com/Relative-Path-Calculator