使CSS url()相对于文档 [英] Making CSS url() relative to document
问题描述
对于CSS，以下规则适用:
When it comes to CSS the following rule applies:
Partial URLs are interpreted relative to the source of the style sheet,
not relative to the document.
但这是我的问题:
我有使用相同CSS文件的不同网站.尽管它们使用相同的布局，但是CSS引用的实际图像对于每个图像都是不同的.
I have different websites that use the same CSS file. While they use the same layout, the actual images the CSS references are different for each one of them.
示例:
#header {
width: 960px;
height: 200px;
background: url(/images/header.png);
}
每个域都有其自己的"images"文件夹和其自己的"header.png"，我希望CSS能够引用该域.目前，它的行为符合预期，并尝试在托管CSS的域中找到png文件.我想要的是从调用CSS文件的域中获取png文件.
Each domain has its own "images" folder and its own "header.png" that I would like the CSS to reference. Currently it behaves as it's supposed to and tries to find the png file on the domain where the CSS is hosted. What I want is for it to get the png file from the domain where the CSS file was called.
我在样式表中使用链接"，因为"@import"会破坏IE中的渐进式呈现.
I use "link" for the stylesheets because "@import" breaks progressive rendering in IE.
有什么建议或解决方法吗?
Any suggestion or workarounds?
推荐答案
我想要的是从调用CSS文件的域中获取png文件.
What I want is for it to get the png file from the domain where the CSS file was called.
对于每个引用的域，您将必须具有单独的URL.因此， www.example1.com 将其样式表引用为/style/sheet.css ，从而从 http://www.example1.com/style/中获取该样式表sheet.css ，而 www.example2.com 从 http://www.example2.com/style/sheet.css 获取它.
You're going to have to have separate URLs for each domain referenced. So www.example1.com references its stylesheet as /style/sheet.css and thus grabs it from http://www.example1.com/style/sheet.css whilst www.example2.com gets it from http://www.example2.com/style/sheet.css.
但是，仅仅是因为它们看上去与客户端不同，并不意味着它们在服务器端必须是不同的文件(暗示所有维护工作).您只需将每个域上的 Alias 指向真实的共享CSS文件即可.
However just because they look different from the client end that doesn't mean they have to be different files on the server side (with all the maintenance that would imply). You could just point an Alias on each domain to the real, shared CSS file.
我能想到的唯一其他解决方法是将URL引用规则(如 background-image )分离出来，并将其放入特定于域的样式表或内部样式表中.
The only other workaround I can think of would be to split out the URL-referencing rules like background-image and put them in a domain-specific stylesheet or an internal stylesheet.
这篇关于使CSS url()相对于文档的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
