Question

如何为两种不同的字体添加两种不同的尺寸？

这是我的身体CSS代码：

body {
  direction: rtl;
  font-family: Roboto, Droid Arabic Kufi;
}

Roboto为英语单词和Droid阿拉伯语Kufi为阿拉伯语单词，如果单词是英语（Roboto）如何使大小为13px但如果它是阿拉伯语（Droid Arabic Kufi）将大小改为12px。

Answer 1

为什么不创建英语和...阿拉伯语课程，包括每个font-family和font-size：

.english {
    direction: ltr;
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
}
.arabic {
    direction: rtl;
    font-family: 'Droid Arabic Kufi', sans-serif;
    font-size: 12px;
}

然后根据它的语言将其分配给html元素：

<span class="english">english text 13px font size</span>
<span class="arabic">arabic text 12px font size</span>

完整代码段示例（使用Droid Sans作为演示代替Droid Arabic Kufi）：

＆＃13;

.english {
  direction: ltr;
  font-family: 'Roboto', sans-serif;
  font-size: 13px;
}
.arabic {
  direction: rtl;
  font-family: 'Droid Sans', sans-serif;
  font-size: 12px;
}

＆＃13;

<link href="https://fonts.googleapis.com/css?family=Droid+Sans|Roboto" rel="stylesheet">
<span class="english">english text 13px font size</span><br>
<span class="arabic">arabic text 12px font size</span>

＆＃13;

Answer 2

为此，您需要将字体分别指定为单独选择的元素的字体。我建议使用课程，一个课程用于英语，一个课程用于阿拉伯语单词。假设您有一个类.english和一个类.arabic。然后你可以有如下样式：

.english {
  direction: ltr;
  font-family: Roboto;
  font-size: 13px;
}

.arabic {
  direction: rtl;
  font-family: Droid Arabic Kufi;
  font-size: 12px;
}

如果不使用类或其他方式来唯一标识包含一种语言或另一种语言的元素，则无法实现此目的。

如何为两种不同的字体添加两种不同的大小

2 个答案: