在css中本地化图像路径

我目前正在本地化我的基于.net framework v3.5的应用程序，该应用程序使用jQuery客户端库。在css中本地化图像路径

我顺利地通过资源JavaScript文件和HTML标记通过.NET C＃代码的图像通过资源文件，客户端文字本地化我的大多数应用程序，在屏幕上的文字。

当本地化我的图像时，简单的更改是更新图像的路径以包括文化文件夹，例如。英语 - 恩，西班牙 - ES等，所以样本图像路径是

/image/folder1/en/image.gif

/image/folder2/es/image.gif

我在我的.net代码中已经实现了这一点，并且一切正常。

但是我遇到了一个问题。我的一些图像是在CSS中设置的背景图像。

h1 {background-image:url("../../Images/folder1/<<culture>>/image1.gif");background-repeat:no-repeat;

所以我要寻找的建议，我怎么能解决此问题：不幸的是，因为我无法定位这样的事情这引发了一个问题。我可以将一个javascript变量值传递给css文件吗？我可以创建一个httphandler并在渲染之前更新我的css，但是宁愿选择这种方式，因为我不希望每个css文件都通过iis进行处理。

任何提示将是伟大的。

2011-05-16 amateur

另一种可能性是设置lang属性的身体（或你感兴趣的HTML元素），所以呈现的HTML页面会显示这样的事情：

<body lang="es"> 
    <h1>...</h1>

然后你可以使用CSS郎伪选择本地化的内容：

h1:lang(es) {background-image:url("../../Images/folder1/es/image1.gif");} 
h1:lang(en) {background-image:url("../../Images/folder1/en/image1.gif");}

这是标准（如W3C建议）的本地化CSS文件的方式。

2011-05-16 18:41:13

这似乎是一个完美的解决方案。所有浏览器都支持吗？ – amateur 2011-05-16 21:32:07

这是CSS2功能，所以理论上所有的浏览器**都应该支持它。不过，说实话，似乎IE9有问题（早期版本没有）。它可能与声明有关（我的意思是DTD），所以我不能100％确定。但IE9可以切换到兼容性视图，这应该可以解决问题（如果有的话）。其他浏览器似乎工作。 – 2011-05-17 06:10:06

+1我在处理特定项目时遇到过类似的解决方案。但是这有一些限制：我的意思是如果差异的数量太大，将原始的css文件拆分成一个共同的基础和多个本地化的文件可以更容易维护。 – sitifensys 2011-05-17 19:28:15

如果你没有太多的元素与BG图像，你可以给这些元素class names和硬编码的语言参考。例如。

h1.engish {background-image:url("../../Images/folder1/en/image1.gif")...; 
h1.spanish {background-image:url("../../Images/folder1/es/image1.gif")...;

2011-05-16 17:48:37

一个简单的解决方案可以被创建为每个仅包括经修改的图像路径语言另一个CSS文件，并且主后的CSS加载它。

2011-05-16 17:49:28 morgar

除非你是动态生成CSS文件，你不能传递变量给它。

你可以把背景图像路径内联，不过，通过在标签包装他们。

2011-05-16 17:52:09

您可以生成CSS dinamically

<link href="sitecss.aspx" type="text/css" rel="stylesheet" />

然后在sitecss.aspx你可以做你的代码做同样的：调用文件，以防止之间的缓存时

h1 {background-image:url("../../Images/folder1/<%= culture %>/image1.gif");}

使用不同的参数文化：

<link href="sitecss.aspx?culture=<%= culture %>&ver=<%= siteversion %>" type="text/css" rel="stylesheet" />

2011-05-16 18:49:10

回答