Встраивание шрифтов в iPad

Я пытаюсь встроить шрифты Google в WebView на iPad.

Если я помещу это в голову, все будет работать нормально:

<link href='http://fonts.googleapis.com/css?family=Monofett' rel='stylesheet' type='text/css'>

HTML является локальным, тогда мне нужно скопировать CSS и шрифты на моем iPad.

Когда я делаю это, шрифты не работают:

HTML:

<link href='fonts/fonts.css' rel='stylesheet' type='text/css'>

шрифты/fonst.css:

@font-face {
  font-family: 'Monofett';
  font-style: normal;
  font-weight: normal;
  src: local('Monofett'), url('http://themes.googleusercontent.com/static/fonts/monofett/v1/94n9d8-lEEaOz-Sn4plHGPesZW2xOQ-xsNqO47m55DA.woff') format('woff');
}

Я знаю, что все еще использую удаленные подключения, но почему это не работает?

Интернет отлично выглядит в Safari и Firefox.


person Brais Gabin    schedule 07.09.2011    source источник


Ответы (3)


Мальчик, у меня есть отличный ответ для вас! У меня была такая же проблема, и это сработало как шарм.

Вы должны использовать загрузчик Google API. Вот код, который я поместил в свой тег заголовка.

<!-- Google API Loader -->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script type="text/javascript">
    //load jQuery
    google.load("jquery", "1.7.1");

    //Google Fonts
    google.load("webfont", "1");

    google.setOnLoadCallback(function() {
        WebFont.load({
            google: {
              families: [ 'Lobster+Two:700italic,700,400italic,400', 'Alegreya:400,400italic,700' ]
            }
        });
    });
    </script>

Вот некоторая информация о загрузчике API: https://developers.google.com/loader/?hl=ja#intro

И немного информации об использовании его с Google Fonts: https://developers.google.com/webfonts/docs/webfont_loader

person rgb_life    schedule 13.03.2012
comment
Загрузчик веб-шрифтов поддерживается начиная с iOS 4.2 и выше, поэтому он не будет работать на iPad1. - person Bjorn; 22.06.2012
comment
@Бьорн. Не правда. iPad1 не ограничивается iOS 4.2. - person m b; 07.11.2013

Проблема в формате woff. Google знает об этом, и он возвращает вам другой CSS, когда вы используете Safari на ПК или iPad. Правильный CSS:

@font-face {
 font-family: 'Monofett';
 font-style: normal;
 font-weight: normal;
 src: local('Monofett'), url('./BezoWS-9nng_g31KmAteQ3YhjbSpvc47ee6xR_80Hnw.ttf') format('truetype');
}
person Brais Gabin    schedule 08.09.2011

Вот версия cwTeXHei для поддержки веб-шрифтов Google в браузере iPhone.

@font-face {
  font-family: 'cwTeXHei';
  font-style: normal;
  font-weight: normal;
  src: local('cwTeXHei'), url('./fonts/cwTeXHei-zhonly.ttf') format('truetype');
}

URL-адрес будет начинаться с папки css.
Это работает на ios 10 safari
спасибо Брайсу Габину.

person Red    schedule 24.08.2017