css - 从 CSS 文件中读取国际化内容

Question

我在 UI 开发方面没有太多经验。我有一个用 CSS 定义的类，像这样-

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

我希望“my content” 值国际化(以英语显示为my content，以另一种语言显示为something else) .是否可以通过 CSS 代码实现？

Answer 1

我建议将您的本地化与 CSS 分开，因为它主要用于样式化，而且您可能无论如何都要对 HTML 进行本地化。如果您可以向 HTML 添加另一个属性，您可以尝试使用 content用attr()从选定的 HTML 内容中引用数据属性的值。所以像这样使用 HTML:

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

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

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

请记住，content 属性只能用于伪元素。有关更多信息，我会向您推荐 MDN page about the content property .