在网页中有两种 CSS 嵌入语言样式，用于不同的文本语言类型答案

【问题标题】：Have two CSS embedded languages style in web page for different text lang type在网页中有两种 CSS 嵌入语言样式，用于不同的文本语言类型
【发布时间】：2014-09-30 19:50:58
【问题描述】：

我正在做一个使用 HTML、CSS、PHP 和 JS 的多语言网站，因此根据用户输入，当我从数据库中提取数据时，文本可能是英文或法文。

在 CSS 中是否有一种方法可以自动检查文本是否为英文，因此它将应用嵌入的英文字体，如果它在法国，它将应用嵌入的法国字体。

如果我以前知道该语言，我会将一些 CSS 类应用于文本 HTML 元素，例如 <p class="en"></p> 或 <p class="fr"></p>。但我不知道来自 DB 的文本的语言。

【问题讨论】：

你是怎么知道这门语言的？我猜是使用 php 吗？
不，CSS 无法自动知道文本是什么语言。为什么不能使用特定的 CSS 类？它只需要包装所有用户生成的内容。
我同意 @ReinerGerecke 但如果你现在可以使用 php 的语言（一个包含值 "en,fr,ar....." 的 get 变量），那么我可能有一个解决方案你
该语言被称为“法语”，而不是“法国”。 :-) （或者可以说，该语言称为 Français。）
抱歉英语不好，但我不懂语言。但我知道它应该是英语或法语，如果我以前知道该语言，我会将一些 CSS 类应用于文本 HTML 元素，例如
或

.

标签： javascript php html css

【解决方案1】：

浏览器不会根据文本检测语言，但如果您使用正确的标记指定它：

<html lang="fr">

那么你可以使用the language psuedo-class:

html:lang(fr) {
    /* your rules */
}

【讨论】：

知道对此的支持有多好吗？相对于html[lang=fr] 或使用类？
CSS Tricks article - :lang(X) is a recommendation of the CSS Level 2 Revision 1 spec and orignally recommended as a part of the CSS Level 2 spec.
@T.J.Crowder — 遗憾的是，我找不到任何统计数据，而且它似乎没有在 caniuse 上列出
人们也会对IE Implementations - This pseudo-class requires that Windows Internet Explorer be in IE8 Standards mode or higher感兴趣
@T.J. Crowder：请注意，除非在元素上明确设置了属性，否则属性选择器将不起作用。我写了一个解释差异的答案：stackoverflow.com/questions/8916360/…

【解决方案2】：

没有使用 CSS 的本地方法，但您的服务器大概知道它是用英语还是法语响应。因此，您可以做类似 Modernizr 所做的事情，并在 <html> 标签中添加一个类：

 <html class='french'>

然后您可以拥有基于此的 CSS 规则：

 .french body { font-family: YourFrenchFont, sans-serif; }

edit — Quentin 的答案类似但更好，因为它使用了为此目的而设计的标准符号。但是，对于那些不幸不得不关心的人来说，这将在旧版本的 IE 中工作。

【讨论】：