css - 将 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'); 
}