1

我在这里为客户重新设计了一个网站（使用 MODX CMS） ，我使用了 2 种不同的 Google 字体。

我可以在桌面上显示它们，但不能在移动设备上显示。

我尝试了适用于 Android 的 Chrome 和 iOS 上的 Safari。

在桌面（Mac 和 Windows）上它可以正常工作（使用不同的浏览器）。

我把它们链接错了吗？

这是我在 CSS 中的内容：

@import url('https://fonts.googleapis.com/css?family=Zilla+Slab:300,300i,400,400i,500,500i,600,600i,700,700i');

@import url('https://fonts.googleapis.com/css?family=Kanit:400,400i,500,500i,600,700,800');

body {
font-family: 'Zilla Slab', serif !important;
}

h1 {
font-family: 'Kanit', sans-serif;
text-transform: uppercase;
color: #e63f2f;
font-size: 20px;
}

h2 {
font-family: 'Kanit', sans-serif;
text-transform: uppercase;
color: #e63f2f;
}

我尝试过的也是停用模块 MinifyX 但没有任何变化。

有什么想法或建议吗？

提前致谢

4

1 回答 1

1

要在CSS中链接以下两种字体，请执行以下操作：

@import url('https://fonts.googleapis.com/css?family=Zilla+Slab');

font-family: 'Zilla Slab', serif;


@import url('https://fonts.googleapis.com/css?family=Kanit');

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

或通过HTML：

<link href="https://fonts.googleapis.com/css?family=Zilla+Slab" rel="stylesheet">

font-family: 'Zilla Slab', serif;


<link href="https://fonts.googleapis.com/css?family=Kanit" rel="stylesheet">

font-family: 'Kanit', sans-serif;
于 2018-05-31T14:14:44.270 回答