如何使用谷歌网页字体API

Hello! 本视频教程展示了如何 使用谷歌网页字体 API 添加网页字体到您的 HTML pages.

你可能想在你的网页上使用自定义网页字体 HTML website 将它们应用于页面的特定元素.

让我们学习一下怎么做.

首先，你需要得到 链路属性 为要添加到站点的字体设置.

1. 导航到 谷歌网页字体 站点并选择要使用的字体.

   使用右侧的滤镜来获得适合您需要的字体选项:

   

2. Hover 所需的字体名称，并单击 “看标本” button:

   

3. 在字体页面检查字体描述，以确保这是你需要的字体.

   然后,单击 选择此字体 右上方按钮:

   

4. 现在字体被选中了, 点击屏幕右下角出现的工具条:

   

5. 在出现的弹出窗口中查找 嵌入代码:

6. 将代码复制到剪贴板并将其粘贴到 head tag of your index.html file:

   

   不要忘记保存文件以应用更改.

   您需要将字体包含到您的每个 HTML files.

7. 现在，导航回字体页面并查找 CSS rule there:

   font-family: 'Roboto';

8. 使用此规则 CSS selector 在你的网站上想要的部分，e.g.:

   body {
   	font-family: 'Roboto';
   }

   The above CSS rule 会应用新增的吗 Roboto font to the body text of your website:

   

9. 保存文件以应用更改.

10. 导航到您的站点并刷新页面以查看更改.

    你可以看到 Roboto字体 应用于您网站的正文:

    

本教程到此结束. 现在你知道如何使用谷歌网页字体 API 添加网页字体到您的 HTML pages.

请随时查看下面的详细视频教程: