Css 链接相对于样式表的背景图像

我正在编写这个Wordpress网站，我有一个样式表，其中我经常引用外部背景图像

我不想硬链接这些图像，但当我使用相对链接时，Wordpress permalink结构会破坏一切，因为它将内部页面嵌套在目录（我猜是伪目录）中

点击我引用的URL中的一个页面，你就会明白我的意思

.area-heading {
    background: url('../../../images/titlechevron.png') no-repeat left;
    margin: 2px 0 11px 2px;
    height: 16px;
    }

此外，如果我链接了与域根相关的内容，那么当我将站点移出测试目录/adv/并移动到它自己的域时，我希望所有的背景图像都会中断

---

在这里链接我的图片最好的方法是什么？我觉得我缺少了一个核心概念。

在外部样式表中，所有相关URL都应该是相对于CSS文档的

/styles/screen.css
/images/foo.png

如果screen.css希望使用foo.png作为背景图像，则会这样引用它：

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

当您使用相对URL时，如果不修改CSS文件中的路径，您就不能随意移动这些文件

---

听起来您需要一个测试环境，在这个环境中，您的资产的结构与您的活动站点的结构相同。这样的环境可以通过在桌面计算机上设置web服务器来创建（我个人使用在桌面上运行unix的虚拟机作为web服务器），但这超出了本问题的范围。在“test”目录中设置指向资产的符号链接也可以起作用。

在外部样式表中，所有相关URL都应该与CSS文档相关

/styles/screen.css
/images/foo.png

如果screen.css希望使用foo.png作为背景图像，则会这样引用它：

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

当您使用相对URL时，如果不修改CSS文件中的路径，您就不能随意移动这些文件

---

听起来您需要一个测试环境，在这个环境中，您的资产的结构与您的活动站点的结构相同。这样的环境可以通过在桌面计算机上设置web服务器来创建（我个人使用在桌面上运行unix的虚拟机作为web服务器），但这超出了本问题的范围。在“test”目录中设置指向资产的符号链接也可以起作用。

使用WordPress，保持图像完整的最简单方法是将图像放入主题文件夹（style.css文件所在的位置），然后，无论您将站点安装在何处，相对于style.css文件，图像将位于同一位置

通常，我会创建一个名为“images”的文件夹，并将其放入我的主题文件夹中。然后，为了链接到图像，我可以使用（在样式表中）url（'images/photo.jpg'），等等

---

然后，主题文件将包含主题正确显示所需的所有内容-所有样式、图像和主题文件都在一起

使用WordPress，保持图像完整的最简单方法是将图像放入主题文件夹（style.css文件所在的位置）-然后，无论您将站点安装在何处，图像都将位于相对于style.css文件的相同位置

通常，我会创建一个名为“images”的文件夹，并将其放入我的主题文件夹中。然后，为了链接到图像，我可以使用（在样式表中）url（'images/photo.jpg'），等等

然后，主题文件将包含主题正确显示所需的所有内容-所有样式、图像和主题文件都在一起