如何在我自己的服务器上托管 google web 字体? [英] How to host google web fonts on my own server?

查看:20
本文介绍了如何在我自己的服务器上托管 google web 字体?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我需要在 Intranet 应用程序上使用一些 google 字体.客户端可能有也可能没有互联网连接.阅读许可条款,似乎是法律允许的.

I need to use some google fonts on an intranet application. The clients may or may not have internet connection. Reading the license terms, it appears that its legally allowed.

推荐答案

请记住,我的回答已经过时了.

Please keep in mind that my answer has aged a lot.

下面还有其他技术上更复杂的答案,例如:

There are other more technically sophisticated answers below, e.g.:

所以不要让这是目前公认的答案这一事实让您觉得这仍然是最好的答案.

so don't let the fact that this is the currently accepted answer give you the impression that this is still the best one.

您现在还可以通过 github 的 google/font 存储库下载 google 的整个字体集.他们还提供了~420MB 字体的 zip 快照.

You can also now also download google's entire font set via on github at their google/font repository. They also provide a ~420MB zip snapshot of their fonts.

您首先将字体选择下载为一个压缩包,为您提供一堆真字体.将它们复制到公共的某个地方,您可以从您的 css 链接到某个地方.

You first download your font selection as a zipped package, providing you with a bunch of true type fonts. Copy them somewhere public, somewhere you can link to from your css.

在 google webfont 下载页面上,您会找到一个包含链接,如下所示:

On the google webfont download page, you'll find a include link like so:

http://fonts.googleapis.com/css?family=Cantarell:400,700,400italic,700italic|Candal

它通过一堆 @font-face 定义链接到定义字体的 CSS.

It links to a CSS defining the fonts via a bunch of @font-face defintions.

在浏览器中打开它,将它们复制并粘贴到您自己的 CSS 中,并修改网址以包含正确的字体文件和格式类型.

Open it in a browser to copy and paste them into your own CSS and modify the urls to include the right font file and format types.

所以:

    @font-face {
      font-family: 'Cantarell';
      font-style: normal;
      font-weight: 700;
      src: local('Cantarell Bold'), local('Cantarell-Bold'), url(http://themes.googleusercontent.com/static/fonts/cantarell/v3/Yir4ZDsCn4g1kWopdg-ehHhCUOGz7vYGh680lGh-uXM.woff) format('woff');
    }

变成这样:

    /* Your local CSS File */
    @font-face {
        font-family: 'Cantarell';
        font-style: normal;
        font-weight: 700;
        src: local('Cantarell Bold'), local('Cantarell-Bold'), url(../font/Cantarell-Bold.ttf) format('truetype');
    }

如您所见,以这种方式在您自己的系统上托管字体的缺点是,您将自己限制为真正的字体格式,而 google webfont 服务则由访问设备决定将传输哪些格式.

As you can see, a downside of hosting the fonts on your own system this way is, that you restrict yourself to the true type format, whilst the google webfont service determines by the accessing device which formats will be transmitted.

此外,我必须将 .htaccess 文件添加到我的包含 mime 类型字体的目录中,以避免在 Chrome Dev Tools 中弹出错误.

Furthermore, I had to add a .htaccess file to my the directory holding the fonts containing mime types to avoid errors from popping up in Chrome Dev Tools.

对于这个解决方案,只需要真正的类型,但是当你想要包含不同的字体时定义 more 也没有什么坏处,比如 font-awesome.

For this solution, only true type is needed, but defining more does not hurt when you want to include different fonts as well, like font-awesome.

#.htaccess
AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff

这篇关于如何在我自己的服务器上托管 google web 字体?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆