在 iPad 中嵌入字体

发布于 2024-12-03 11:47:10 字数 743 浏览 0 评论 0原文

我正在尝试将 Google 字体嵌入 iPad 的 WebView 中。

如果我把这个放在 head 中，一切正常：

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

html 是本地的，那么我需要复制 iPad 中的 CSS 和字体。

当我这样做时，字体不起作用：

html:

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

fonts/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 中看起来不错。

原文

I am trying to embed Google fonts in a WebView in iPad.

If I put this in the head all works fine:

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

The html is local then I need to copy the CSS and the fonts in my iPad.

When I do this changes the fonts doesn't work:

html:

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

fonts/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');
}

I know I'm still doing remote connections but why doesn't work this?

The web looks fine in Safari and Firefox.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

落花随流水 2024-12-10 11:47:10

男孩，我有一个很好的答案给你吗！我也遇到了同样的问题，这就像一个魅力。

您必须使用 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

Boy, have I got a great answer for you! I had the same problem and this worked like a charm.

You have to use the Google API loader. Here's the code I put into my header tag.

<!-- 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>

Here is some info about the API loader:
https://developers.google.com/loader/?hl=ja#intro

And some info about using it with Google Fonts:
https://developers.google.com/webfonts/docs/webfont_loader

回复收藏 0 原文

枕花眠 2024-12-10 11:47:10

问题是 woff 格式。 Google 知道这一点，当您在 PC 或 iPad 中使用 Safari 时，他会返回不同的 css。正确的 CSS 是：

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

The problem is the woff format. Google know that and he return you a different css when you use Safari in PC or in iPad. The correct CSS is:

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

回复收藏 0 原文

秋日私语 2024-12-10 11:47:10

这是一个 cwTeXHei 版本，为了在 iPhone 浏览器上支持 google web 字体，

@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
谢谢布雷斯·加宾。

Here is an cwTeXHei version , for support google web fonts on iPhone browser

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

the url will begin at css folder.
This works on ios 10 safari
thanks Brais Gabin.

回复收藏 0 原文

~没有更多了~