通过css本地化图像

我工作的网站上有很多包含文本的图像。这包括按钮和导航。通过css本地化图像

为了支持本地化，我包含了2个css文件。一种具有非语言特定属性（字体，颜色...）和具有特定语言属性的属性。取决于他选择的语言，只有1个语言特定文件被提供给用户。

语言特定的文件（/content/en/Site.css，/content/de/Site.css ..）大约有背景图像

div.topHeader p#searchHeader 
{ 
    background: url(/images/de/headers/search_lo.gif) no-repeat scroll center center; 
}

该工程进展顺利，但我将有很多的信息重复的代码。在英语中，CSS将是：

div.topHeader p#searchHeader 
{ 
    background: url(/images/en/headers/search_lo.gif) no-repeat scroll center center; 
}

我有一对夫妇的语言这就是为什么它会真的付出了优化这一点。有一个更好的方法吗？

来源

2009-08-03 Mathias F

只需从主CSS中提取语言特定部分到每种语言的新CSS，并将该CSS动态包含在页面中。这样就不必管理大量的CSS类。

来源

2009-08-03 09:43:28

您可以尝试将所有外部图形引用合并到单独的CSS中，并在代码中单独引用它。

如果您动态地指定CSS中的表单路径，那么您可以编写一个处理程序来处理您对CSS的特定请求，在服务器端从文件中读取它，根据需要替换所有语言标记部分（文档。替换（“{lang}”，“de”）），然后将修改后的CSS返回。但这需要一些工作。

来源

2009-08-03 09:43:27 User

您可以使用一种文件site.css.aspx或其他类似文件为每种语言设置不同的CSS文件并处理该文件，然后根据提供的POST/GET变量语言或接受头文件输出路径。

查看类似的问题here

来源

2009-08-03 09:43:28 beggs

好主意！ ........... – 2009-08-03 22:03:54

一开始，你可以使用的background-image代替background保存重复重复，定位，滚动和色彩信息。

要真正优化它，我只需根据用户的本地化动态地提供CSS。例如：通过PHP脚本或其他东西。你可以做一些像background-image: url(/images/<?=$lang ?>/headers/search_lo.gif)。

来源

2009-08-03 09:43:31 dampkwab

不知道，但u能有这样的事情，

div.topHeader p#searchHeader { 
background: url(/images/headers/search_lo__en.gif) no-repeat scroll center center; } 


div.topHeader p#searchHeader { 
background: url(/images/headers/search_lo__de.gif) no-repeat scroll center center; }

，其中最后一个字后__（dauble下划线）将动态添加

为

div.topHeader p#searchHeader { 
background: url(/images/headers/search_lo__{%lang%}.gif) no-repeat scroll center center; }

来源

2009-08-03 09:45:39 Posto

一个简单的解决办法是根据其语言环境将类或ID应用于HTML中的body标签。然后在样式表中，你可以这样做：

div.topHeader p#searchHeader 
{ 
    background: no-repeat scroll center center; 
} 

body.en div.topHeader p#searchHeader 
{ 
    background-image: url(/images/en/headers/search_lo.gif); 
} 

body.de div.topHeader p#searchHeader 
{ 
    background-image: url(/images/de/headers/search_lo.gif); 
}

仍然有将是一个位复制的，但你降低你必须写为每个本地化的CSS量。

来源

2009-08-03 09:48:02

您可以创建PHP或类似的动态CSS。下面是一个PHP例子：

的index.html：

<link rel="stylesheet" type="text/css" media="screen" href="style.php">

style.php：

<?php 
    header("Content-type: text/css"); 
    $lang = $_SESSION['however_you_are_detecting_lang']; 
    ?> 
    body { 
    background-image:url(images/<?=$lang?>/image.png); 
    }

，将获取的图像/ EN/image.png或图像/德/ image.png

来源

2009-08-03 09:51:32 doctororange

通过css本地化图像

回答

相关问题