在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

根据W3：

部分URL是相对于样式表的源而不是相对于文档来解释的

因此，在回答您的问题时，它将相对于/stylesheets/。

如果考虑到这一点，这是有道理的，因为CSS文件可以添加到不同目录中的页面上，因此将其标准化为CSS文件意味着URL可以在链接样式表的任何地方使用。

它是相对于CSS文件的。

它是相对于样式表的，但是我建议将URL相对于您的URL：

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

这样，您就可以移动文件而无需将来重构它们。

为了创建不依赖于资源绝对位置的模块化样式表，作者可以使用相对URI。相对URI（在[RFC3986]中定义）使用基本URI解析为完整URI。RFC 3986第5节定义了此过程的规范算法。对于CSS样式表，基本URI是样式表的基础URI，而不是源文档的基础URI。

例如，假设以下规则：

body { background: url("yellow") }

位于URI指定的样式表中：

http://www.example.org/style/basic.css

源文档的正文的背景将与URI指定的资源描述的任何图像平铺

http://www.example.org/style/yellow

用户代理在处理无效URI或指定不可用或不可用资源的URI方面可能会有所不同。

取自CSS 2.1规范。

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

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

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

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

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

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

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

尝试使用：

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

Images 是保存要发布图片的文件夹。