如何在css中本地化内容块？

Question

因此，作为相当普遍的做法，我们使用css内容来定位真正“风格”特定的文本。例如

.label:after { content: ":"; }

然而，有人向我指出，这种事情在某些文化中有所不同。哦，哦。

有没有人有一个很好的模式来处理这类事情，因为CSS文件通常不通过asp.net处理器传递，因此无法访问资源文件。

Answer 1

我真的很喜欢这个问题，所以我想了一下。这对你来说是一个好方法吗？

<label data-after=":">Name</label>

然后，在你的CSS中你可以这样做：

label:after {
  content: attr(data-after);
}

以下是它的快速演示： http://jsbin.com/iYEKOH/1/edit?html,css,output

使用Modernizr对不支持它的浏览器进行polyfill应该很容易。我认为它会添加no-generatedcontent类。

---

另一个......这种方法怎么样？

html label:after { content: '' }
html[lang=en] label:after { content: ':' }

Answer 2

这种做法怎么样？它会让您根据lang属性进行切换。

html label:after { content: '' }
html[lang=en] label:after { content: ':' }

Answer 3

如果我在PHP中执行此操作（脚本语言并不重要，只影响实现细节），我会设置包含依赖于本地化的所有规则的CSS文件。

例如，local-en.css，local-fr.css等等。

在我的网站模板中，我会检查我的本地化标志，然后加载或链接到相应的CSS文件，同时考虑到文件的顺序，以确保所有CSS规则正确级联。