CSS 如何从 Google Fonts 下载 WOFF 文件?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26874901/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 02:44:48  来源:igfitidea点击:

How can I download WOFF files from Google Fonts?

cssfontscross-browsergoogle-font-api

提问by cantsay

Google Fonts seems to only offer fonts in WOFF2.

Google Fonts 似乎只提供 WOFF2 中的字体。

While this works fine with Chrome, WOFF2 doesn't seem to be supported by many other browsers

虽然这适用于 Chrome,但许多其他浏览器似乎不支持 WOFF2

Is there a way to directly link to Google fonts hosted on their CDN in a format other than WOFF2?

有没有办法以 WOFF2 以外的格式直接链接到 CDN 上托管的 Google 字体?

回答by udondan

Unfortunately Google does not offer an easy way to directly download fonts. You can browse the raw git repositoryto search for the file you want.

不幸的是,谷歌没有提供直接下载字体的简单方法。您可以浏览原始git 存储库以搜索您想要的文件。

Do not link to the GitHub hosted fonts in your CSS though! GitHub serves the files with the wrong mime type, which causes issues in some browsers.

但是不要在你的 CSS 中链接到 GitHub 托管的字体!GitHub 使用错误的 MIME 类型提供文件,这会导致某些浏览器出现问题。

While there is not a mainstream CDN for all the formats, you can use http://google-webfonts-helper.herokuapp.comto download the font files and host them yourselves.

虽然没有适用于所有格式的主流 CDN,但您可以使用http://google-webfonts-helper.herokuapp.com下载字体文件并自行托管。

回答by Dheeraj Vepakomma

When I open the following URL in Chrome, I get a link to the font in woff2format. When I use Firefox, it's in woffformat and in an Android device running pre-4.4, it is in ttfformat.

当我在 Chrome 中打开以下 URL 时,我会得到一个字体链接woff2。当我使用 Firefox 时,它是woff格式化的,在运行 4.4 之前的 Android 设备中,它是ttf格式化的。

http://fonts.googleapis.com/css?family=Open+Sans

http://fonts.googleapis.com/css?family=Open+Sans

So it appears that Google delivers fonts in a format appropriate to the requesting user-agent.

因此,Google 似乎以适合请求用户代理的格式提供字体。

回答by MikeiLL

Another option is using the following (node) gulppackage: gulp-google-webfonts.

另一种选择是使用以下(节点包:吞-谷歌-网络字体

Once installed it takes moments to install fonts and create corresponding css.

安装后,需要花一些时间来安装字体并创建相应的 css。

Note that when installing a Google Font with whitespace in the name, (you don't escape it) reference it with the plus sign as follows:

请注意,在安装名称中带有空格的 Google 字体时,(不要对其进行转义)使用加号引用它,如下所示:

fonts.list

字体列表

Cabin+Sketch:400

回答by isapir

You can use everythingfonts.comto convert the ttffile to a wofffile.

您可以使用everythingfonts.comttf文件转换为woff文件。