如何使用我在Visual Studio Code中购买的字体...以及下载Woff2文件时出现问题

时间:2019-07-01 03:17:17

标签: fonts visual-studio-code woff2

我正在用VS Code构建我的第二个网站,并购买了我想使用的字体。我了解我需要将文件下载到我的根文件夹中。我无法下载文件。当我双击woff2文件时,出现一个弹出窗口,告诉我它们无法打开(如果这很重要,我正在运行Windows 10)。我不知道该怎么办。我以前从未尝试过这样做,而且在线上似乎也没有太多信息。感谢帮助。我包括了字体随附的说明。我解压缩了该文件夹,该文件夹当前在VS Code中的根文件夹中。但是我无法下载字体文件。

  1. 上传您的套件 将套件的内容上载到您的服务器。通常,这是使用某种类型的FTP程序完成的-与将图片和其他文件上传到网站的方式相同。通常,将所有文件和文件夹上载到站点的根文件夹是最简单的。您可以替代地创建一个子文件夹(或使用现有的子文件夹),然后将工具包放在此处,将其放置在所需的任何位置。确保在第二步中记下您需要的位置。

  2. 编辑您的网站 包括对套件的引用。在工具包的主文件夹中找到CSS文件。您应该在网站的HTML代码的头部放置对此文件的引用。确保引用出现在您网站的所有HTML页面上。

这会将套件中的网络字体链接到您的网站。如果您将工具包上传到站点的根文件夹,则只需将下面的代码复制并粘贴到站点的头部即可。如果您将工具包上载到子文件夹,则需要调整CSS文件中字体文件的路径。

  1. 编辑CSS 现在是有趣的部分!您需要将webfonts(字体系列)分配给标签,类和其他CSS选择器。您需要确定要在网站上的哪个位置使用Web字体。使用CSS,您可以将webfonts分配给站点的特定区域。有几种方法可以做到这一点,这是基础知识,我们将在下面的“示例代码”部分中探索更高级的选项。

一个简单的方法是创建一个新的类选择器,然后分配Web字体的系列名称。只要您想使用SaturdayScript,就可以在HTML中分配该类。

0 个答案:

没有答案