CSS字体的font-family属性和@font-face使用方法

CSS字体的font-family属性：

font-family属性一共有5个字体系列，分别是：
sans-serif： 包括没有衬线的字体，与serif相比，通常认为sans-serif在计算机屏幕上更容易识别。

serif： 包括有衬线的字体，看到这种字体就会想到新闻报纸的文字排版。

monospace： 包含固定宽度的字符，例如，一个“i”在水平方向所占宽度与一个“m”所占宽度是相同的，主要用于显示软件代码示例。

cursive： 包括看似手写的字体，有时会看到标题中运用这些字体。

fantasy： 包含有某种风格的装饰性字体。

使用规则 ：
例子：给body标签添加样式

body {font-family: Verdana, Geneva, Arial, sans-serif;
}

通常指定的font-family包含一个候选字体系列列表，它们都来自同一个字体系列。
候选字体要完全按照输入要求进行输入，大小写必须一致。
最后总是放一个通用的字体系列名，如“sans-serif”，“serif”，因为计算机会从第一个字体开始查看电脑上是否有这个字体，如果有这个字体则应用这个字体，如果没有就会查询下一个字体，要是全部候选字体都没有查到则会使用浏览器默认的“sans-serif”字体（根据最后一个来决定使用什么默认字体），这就是为什么需要在最后面添加通用字体系列名的原因。

@font-face规则的使用：

这个规则允许你定义一种字体的名字和位置，然后可以在你的页面使用。
使用步骤：
1.先从字体网站下载自己需要的字体
2.确保下载的字体中包含所需字体的所有格式
常用字体扩展名包含：“.ttf”，“.otf”，“.eot”，“.svg”，“.woff”
如果没有的话可以进入网站（https://www.fontsquirrel.com/）进行如下操作：
（1）进入网站，点击发电机（Generator）

（2）依次点击上传字体、最佳、协议和下载套件
（3）解压压缩包即可得到其他扩展名的字体
3.在自己的Web项目中建立的fonts文件夹中导入下载好的字体

4.将字体包中自带的stylesheet.css样式表导入项目的css文件夹下，并修改@font-face的src路径

5.在.html文件中导入css样式表

6.在stylesheet.css样式表中给自己想要添加该样式的属性添加样式，这里的font-family属性值必须和@font-face中的一样。

7.保存代码，运行即可。