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

2018-06-11 02:01:50

在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文件。

它与样式表相关，但我建议将网址与您的网址相关联：

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

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

链接地址: http://www.djcxy.com/p/31845.html