如何获取这些谷歌字体以供离线使用



我正在使用metronic主题来构建我的 Web 应用程序。 在每一页上,此代码是<head>标记中的第一个:

<script>
WebFont.load({
google: {"families":["Poppins:300,400,500,600,700","Roboto:300,400,500,600,700"]},
active: function() {
sessionStorage.fonts = true;
}
});
</script>

我需要从谷歌获取这些字体,以便我可以在本地离线使用它们。我怎样才能得到它们?我应该写什么代码。谢谢。

的拳头下载字体并转到font generator喜欢 : https://transfonter.org/,您可以下载此文件并根据文件放置

我也有同样的问题,但我通过以下步骤解决了它:

1)如您所知,您可以使用googleapi导入google字体,因此首先我制作了适当的url,例如:

"https://fonts.googleapis.com/css?family=Roboto:300,400,500,600,700">

"https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700">

这些 url 应返回包含字体源的 css 文件。

2) 将这些文件保存到适当的路径。

3)您需要在"字体脸"的"src"中逐个下载源网址,然后将其放入适当的路径。例如,在以下截图的 css 上:

@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 300;
src: local('Poppins Light'), local('Poppins-Light'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLDz8Z11lFc-K.woff2) format('woff2');
unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;
}

您应该从以下地址下载字体:

"https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLDz8Z11lFc-K.woff2">

4)最后根据本地字体文件更正css文件中"src"的"url"。

希望它有帮助。

最新更新