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

我正在编写此Wordpress网站http://searchanddevelop.ca/adv/其中我有一个样式表，我经常参考外部背景图像。链接相对于样式表的背景图像

我不想硬链接这些图片，但是当我使用相对链接时，WordPress的永久链接结构会打破所有内容，因为它嵌套在目录内的内部页面（或者伪目录，我猜）。

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

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

另外，如果我的东西联系起来相对于域根目录，然后当我移动网站进行测试目录/高级/和其自己的域名，我希望所有的背景图像将打破。

在这里相对比较我的图像的最佳方式是什么？我觉得我错过了一个核心概念。

2013-02-19 Orun

使用WordPress，保持图像完整的最简单方法是将它们放入主题文件夹 - （style.css文件所在的位置） - 然后，无论您在哪里安装网站，图像都将与style.css文件相对应。

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

然后，主题文件将包含主题所需的所有内容，以正确显示 - 所有你的造型，图像，&主题文件在一起。

2013-02-20 17:07:05 gscharles

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

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

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

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

当您使用相对URL，你不能去左右你的洗牌CSS文件而不修改这些文件中的路径。

这听起来像是你需要一个测试环境，你的资产结构与你的现场网站相同。这样的环境可以通过在台式机上设置一个Web服务器来创建（我个人使用的虚拟机在我的桌面上为我的Web服务器运行unix），但这超出了这个问题的范围。在你的“测试”目录中设置符号链接也可以工作。

2013-02-19 20:23:41 cimmanon

回答