Шрифты Google отображаются на рабочем столе, но не на мобильном (протестировано на Android и iOS) - PullRequest
0 голосов
/ 31 мая 2018

Я перепроектирую веб-сайт для клиента (с помощью MODX CMS) здесь и использую 2 разных шрифта Google.

Я могу отображать их на рабочем столе, но не на мобильном телефоне.

Я пробовал на Chrome для Android и Safari на iOS.

На десктопе (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, но ничего не изменилось.

Есть идеи или предложения?

Заранее спасибо

1 Ответ

0 голосов
/ 31 мая 2018

Чтобы связать следующие два шрифта в 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;
...