Question

我的网站上使用了三种基本语言。我把lang="en"放在html标签中。在CSS文件中，我写了以下内容：

body {

 ...
 font-family: 'Open Sans';
 font-size: 10pt;
 ...
}

因此，如果网站上的文字是英文或俄文，则使用名为 Open Sans 的网络字体。这很好用。

现在我想在亚美尼亚语中使用网页字体 Arian AMU 时，我想这样做，但它不会这样：font-family: 'Open Sans', 'Ariam AMU';

在CSS中，我写了

:lang(hy) {
    font-family: 'Arian AMU';
    font-size: 10.5pt;
    line-height: 18px;
}

当整个文本都是亚美尼亚语时，我将lang="hy"放在p标记中。

问题是，我怎样才能这样做，如果语言是俄语或英语，它写在Open Sans 10pt，当它是亚美尼亚语时，Ariam AMU 10.5pt和行高18px。

Answer 1

pseudo-class :lang比元素选择器body多specificity。当两个规则发生冲突时，这可能会导致问题，例如您的情况。尝试以相同的特异性指定所有冲突规则：

:lang(en), :lang(ru) {
    font-family: 'Open Sans', sans-serif;
    font-size: 10pt;
}

:lang(hy) {
    font-family: 'Ariam AMU';
    font-size: 10.5pt;
    line-height: 18px;
}

请参阅jsFiddle。

通过阅读以下文章，您可以了解有关CSS特异性的更多信息：

语言参考，字体系列

1 个答案: