javascript - 在 css 中本地化图像路径

标签 javascript jquery asp.net css localization

我目前正在本地化我的应用程序,该应用程序基于 .net 框架 v3.5,它使用 jquery 客户端库。

我成功地本地化了我的大部分应用程序,通过资源文件在屏幕上显示文本,通过资源 javascript 文件在客户端文本,通过 .net c# 代码对图像进行 html 标记。

本地化我的图像时,简单的更改是更新图像路径以包含 cultures 文件夹,例如。对于英语 - en、西类牙语 - 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 进行处理。

任何提示都会很棒。

最佳答案

另一种可能性是为正文(或您感兴趣的 HTML 元素)设置 lang 属性,以便呈现的 HTML 页面将显示如下内容:

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

然后你可以使用 CSS lang 伪选择器来本地化内容:

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

这是本地化 CSS 文件的标准(如 W3C 推荐的)方式。

关于javascript - 在 css 中本地化图像路径,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6021182/

相关文章:

javascript - 如何在javascript中将多个 "\n"替换为 "\n\t\t\t"?

javascript - 在释放鼠标按钮之前激活链接

javascript - 无法在 jsfiddle 上获取 iris colorpicker

asp.net - ASP.NET GridView 控件中每 3 行的粗网格线?

asp.net - session 在 4 分钟内过期

javascript - 测试 AngularFireAuth Wrapper,不使用 AngularFireAuth 模拟

setAttribute 中的 javascript onClick 事件

javascript - 如何使用 angularJS 在同一页面中追加条目,而不使用数组来存储先前的条目

javascript - 从控制台阻止 js 攻击

c# - ASP.NET 日期和时间选择器?