如何使用Google Fonts?

如何使用Google Fonts?_第1张图片
谷歌字体库

如何使用 Google Fonts API

  • Google Fonts 提供了超过 800 种的高质量的字体,所有的浏览器都兼容,无需引入 JavaScript,简单易用,更重要的是,免费。(虽然,暂时不支持中文字体,因为中文字体库实在是太大了)。

挑选字体

登录Google Fonts

  • 在主页中,您可以直接浏览所有的字体,可以按单个词语来查看,或者按句子段落来查看整体效果,还可以调整字体大小。如果您对字体分类比较熟悉,就可以使用右边的搜索条件对字体作筛选。找到您喜欢的字体之后,点击"+"按钮,然后在网页下方的"Family Selected"中即可找到您添加的所有字体。

在线测试您的文字

  • 直接在您选好的字体输入框里面输入您要测试的文字,来查看效果。您还可以调整其它的与字体相关的样式,比如字体大小,间隔,变换,等等。

在您的网页中添加字体链接

  • 如果确认使用该字体, 在网页下方的"Family Selected"中,点击"-"按钮,在接下来的页面中,您将看到详细的说明,包括字体链接和如何将字体添加到您的网页中。
Standard 方式:

@import 方式:

  • 下一步定义在那个标签上使用该字体,例如:在标签上使用,
    .myheader {font-family: 'Roboto', cursive;}
    大功告成,您现在可以打开您的网页欣赏一下了。

你可能感兴趣的:(如何使用Google Fonts?)