从CSS文件读取国际化内容 [英] Reading internationalized content from CSS file

问题描述

我在UI开发方面经验不足.我有一个用CSS定义的类，像这样-

I don't have much experience on UI development. I have a class defined in CSS, something like this-

.myclass {
    color: red;
    content: "my content";
    font-size: 12px;
    padding-right: 2px;
}

我希望将"my content"值进行国际化(以英语显示为我的内容，另一种语言显示为其他内容).有可能通过CSS代码实现吗?

I want "my content" value to be internationalized (to be displayed as my content in English and something else in another language). Is that possible achieve it through CSS code?

推荐答案

我建议将您的本地化与CSS分开，因为它主要用于样式设置，并且您可能仍将HTML本地化.如果您可以在HTML中添加另一个属性，则可以尝试使用content和attr()值来引用所选HTML内容中的数据属性.因此，使用这样的HTML:

I would suggest to separate your localization from CSS, since it is primarily meant for styling and you'll be probably localizing the HTML anyway. If it is possible for your to add another attribute to your HTML you could try using content with an attr() value to reference a data attribute from the selected HTML content. So with HTML like this:

<div class="myclass" data-value="My Content"></div>

您可以像这样访问数据属性:

You can access the data attribute like this:

.myclass:before {
  content: attr(data-value);
}

请记住，content属性只能在伪元素上使用.有关更多信息，我建议您有关content属性的MDN页面.

Keep in mind that the content property can only be used on pseudo elements. For further info I'd recommend you the MDN page about the content property.

这篇关于从CSS文件读取国际化内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！