下载 Google 字体并设置使用它的离线站点 [英] Downloading a Google font and setting up an offline site that uses it

问题描述

我有一个模板，它引用了这样的 Google 字体:

I have a template and it has a reference to a Google font like this:

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,300' rel='stylesheet' type='text/css'>

如何下​​载并设置它以在我一直离线运行的页面中使用?

How can I download it and set it up to use in my pages which are running offline all the time?

推荐答案

只需转到 Google 字体 - http://www.google.com/fonts/ ，将您喜欢的字体添加到您的收藏中，然后按下载按钮.然后只需使用@fontface 将此字体连接到您的网页.顺便说一句，如果你打开你正在使用的链接，你会看到一个使用@fontface

Just go to Google Fonts - http://www.google.com/fonts/ , add the font you like to your collection, and press the download button. And then just use the @fontface to connect this font to your web page. Btw, if you open the link you are using, you'll see an example of using @fontface

http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,300

举个例子

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff) format('woff');
}

只需将 url 地址更改为您下载的字体文件上的本地链接即可.

Just change the url address to the local link on the font file, you've downloaded.

您可以更轻松地做到这一点.

You can do it even easier.

只需下载文件，您已链接:

Just download the file, you've linked:

http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,300

将其命名为 opensans.css 左右.

Name it opensans.css or so.

然后只需将 url() 中的链接更改为字体文件的路径.

Then just change the links in url() to your path to font files.

然后将您的示例字符串替换为:

And then replace your example string with:

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

这篇关于下载 Google 字体并设置使用它的离线站点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！