将CSS链接到子文件夹中的图像

Question

我无法找到在我的CSS文件中使用的正确路径

    html { background-image: url('backgroundImage.jpg'); }

我的文件夹结构如下：

..\MySite\ <!-- HTML files here -->

..\MySite\css\

..\MySite\js\

..\MySite\images\ <!-- backgroundImage.jpg here -->

Answer 1

 html{ background-image: url('../images/backgroundImage.jpg'); }

../告诉您的CSS文件返回一个目录并从该文件夹中搜索该图像（在本例中为您的根文件夹）

Answer 2

使用html{ background-image: url('/images/backgroundImage.jpg'); }

从/开始意味着您从网站的根目录开始

Answer 3

非常琐碎的问题。如果您使用内联样式（HTML文件中的样式），那么以下就足够了。

html { 
    background-image: url('images/backgroundImage.jpg'); 
}

但是，如果您要引用css文件夹中的图片，则必须先使用..遍历来到达父文件夹。

html { 
    background-image: url('../images/backgroundImage.jpg'); 
}