在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

回答