字体导入不适用于阿拉伯文本

问题描述

我正在尝试将 Google 字体“Almarai”导入到我的 HTML 代码中，但它不起作用。我尝试了链接和导入方法：

链接方式：

<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Almarai:wght@300&display=swap" rel="stylesheet">

CSS 方法：

@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300&display=swap');

正文 CSS 方法：

@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300&display=swap');

body{
  background: $(body.background);
  background-color: $(body.background.color);
  font-family: 'Almarai',sans-serif;
  font-size: 14px;
  color: $(body.text.color);
  font-weight: 400;
  line-height: 1.4em;
  word-wrap: break-word;
  margin: 0;
  padding: 0
}

它可以工作，但不适用于阿拉伯文本。我无法保留阿拉伯文本的默认字体，因为它看起来一点也不好看。

解决方法

你可以尝试添加这个链接吗

<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Akaya+Telivigala&family=Almarai:wght@300&display=swap" rel="stylesheet">

css 规则

font-family: 'Akaya Telivigala',cursive;

font-family: 'Almarai',sans-serif;

这里是谷歌字体]链接

https://fonts.google.com/specimen/Almarai?preview.text_type=custom&selection.family=Akaya+Telivigala|Almarai:wght@300&query=Almarai&sidebar.open=true

在链接中将 & 更改为 &amp 是否行不通