@font-face是个CSS规则，它允许在互联网上的网页中显示字体在没有这个规则之前，网站管理员可以在他们的网站上使用组有限的字体，这些字体是最常见的，并安装在用户的电脑上随着@font-face的出现，任何特定的字体都可以很容易地被附加到网站上
如果你在我们的网站上下载了字体，你可以在字体的存档中找到现成的CSS代码，你可以将其复制并放到项目所附的CSS文件中
分步安装
1. 选择你想要的字体，并点击 "为网站下载"
2. 在你网站的根目录下创建个字体文件夹，并复制下载的字体
打开你的CSS文档，将档案中的文本文件内容复制到其中
4. 请确保字体文件夹的路径拼写正确根据字体所在的文件夹的位置，路径可能包含个或多个点
5. 完成了复制带有家族名称的属性，并将其粘贴到你要编写样式的选择器中
如果我已经在其他地方下载了字体，我想把它插进去，怎么办？
在这种情况下，你需要在互联网上找到个字体转换器，将你的ttf字体（或otf）转换成正确的格式，即eot、svg、woff和woff2这是为了确保字体在所有浏览器以及移动设备上都能正确显示和工作
然后你需要自己拼出@font-face规则，尊重其语法
@font-face的语法
规则的语法可以大致分为基本属性和高级属性
基本的：
- font-family - 指定字体的名称
- src - 表示字体的路径这可能是位于您网站服务器上的字体的URL，位于其他人服务器上的字体的URL（如谷歌字体），或者仅仅是位于用户计算机上的字体名称（Helvetica New Bold、Tahoma、Georgia等）
扩大了：
- font-display - 决定字体如何出现，取决于它是否已被下载并可使用
- font-stretch - 允许你调整文字的宽度
- font-style - 决定字体是平体、斜体还是斜体（后两者不样）
- font-weight - 设置字体的饱和度，规模为100至900（100-小，900-小）
- font-variant - 决定小写字母应如何呈现--不作修改，或使其全部为小写（大写）
- font-feature-settings - 允许你管理OpenType字体的高级排版功能
- font-variations-settings - 允许通过指定四个字母的轴名对Open Type和TrueType字体的变化进行低级控制
- unicode-range - 指定字体中使用的Unicode代码（字形）的范围
用谷歌字体将字体连接到你的网站上
使用谷歌字体是将字体连接到你的网站的最简单方法进入他们的网站，找到你想要的字体，选择合适的字体进行安装，然后复制代码
复制的代码应放在你的html页面上的head标签的正文中
这种方法的缺点是，如果在网站制作过程中，你失去了互联网--字体将无法显示，并被标准字体取代，因为文件不在本地计算机上，而是在谷歌服务器上另外，当你到客户那里进行布局演示（或仅仅是确认），而他没有Wi-Fi时，问题又会发生
