在CSS文件中使用相对URL，它相对于哪个位置？

在CSS文件中定义诸如背景图片URL之类的内容时，使用相对URL时，它相对于哪里？ 例如：

假设文件/stylesheets/base-styles.css包含：

div#header { 
    background-image: url('images/header-background.jpg');
}

如果我通过<link ... />将此样式表包含在不同的文档中，那么CSS文件中的相对URL是相对于 /stylesheets/ 的样式表文档还是相对于其包含的当前文档 ？ 可能的路径如下：

/item/details.html
/about/index.html
/about/extra/other.html
/index.html

---

#1楼

使用css的自动最小化时，可能会发生的一个问题，并且似乎打破了这一问题。 缩小捆绑包的请求路径可以具有与原始CSS不同的路径。 这可能会自动发生，因此可能引起混乱。

缩小包的映射请求路径应为“ / originalcssfolder / minifiedbundlename”，而不仅仅是“ minifiedbundlename”。

换句话说，将包命名为与原始文件夹结构具有相同的路径（带有/），这样，任何外部资源（如字体，图像）都将被浏览器映射为正确的URI。 另一种方法是在CSS中使用绝对url（refs，但这通常是不希望的。

---

#2楼

尝试使用：

body {
  background-attachment: fixed;
  background-image: url(./Images/bg4.jpg);
}

正在保存要发布Images的文件夹中的图像。

---

#3楼

这对我有用。 加两个点和斜线。

body{
    background: url(../images/yourimage.png);
}

---

#4楼

它是相对于CSS文件的。

---

#5楼

对于CSS样式表，基本URI是样式表的基础URI，而不是源文档的基础URI。

（其他任何东西都会被破坏，IMNSHO）

来源：oschina

链接：https://my.oschina.net/u/3797416/blog/3160075