开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第6天，点击查看活动详情
字体族 font-family
什么是字体族
以下内容引用自关于字体族、字体格式_滚去学习……的博客-CSDN博客_什么是字体族
字体族就是同种字型的不同变体的集合
通用字体族
为了覆盖所有情况，css定义了5种通用字体族:
- 衬线字体：衬线是指字符笔画末尾的装饰，例如l【这里是L的小写】的顶部勾和底部横线
，或是A底部的两条横线
- 无衬线字体：没有衬线的字体，例如L的小写
，例如A
- 等宽字体：所有字所占的横向空间是一样的。例如：l与w所占的实际宽度不同，但是会有空白补齐。该类字体族无所谓有无衬线。
- 草书字体：尝试模仿人类笔迹或是手写体的字体族。
- 奇幻字体：无统一特征，但无法归类为其他四种字体族。
font-family
继承性与动画性
该属性可被继承，没有动画性。
作用
该属性可以给定一个有先后顺序的，以逗号为间隔符的属性值列表来为选定的元素设置字体。每个属性值由 <family-name> 或 <generic-name> 值指定。【关于<family-name> 或 <generic-name> 值请看常见值与单位】
浏览器会选择列表中第一个在计算机上安装的或是通过 @font-face指定的可以直接下载的字体。若是都找不到则使用用户代理的默认字体。
注意
- 对字体的选择是逐字进行的。也就是说即使某个字体用户可以使用，但某个字符在当前的字体文件中没有适合的图形，那么会继续尝试列表中靠后的字体。当一个字体只在某些特定的
font-style、font-variant、或font-size属性值下有效时，这些属性的值也可能对字体族font-family的选择造成影响。 - 字体族名或者是没有引号包括的标识符，或者是引号包裹的一个或多个合法标识串构成的。这意味着在没有带引号的字体族名的开头是不能使用标点符号字符和数字字符的。字体族名包含空格或字符时应该用引号。
属性值
<family-name><generic-name>serif:带衬线字体。sans-serif:无衬线字体。monospace：等宽字体。cursive：草书字体fantasy：奇幻字体system-ui：从浏览器所处平台处获取的默认用户界面字体。emoji：emoji表情包字体math：针对显示数学相关字符的特殊样式问题而设计的字体：支持上标和下标、跨行括号、嵌套表达式和具有不同含义的 double struck glyphsfangsong：仿宋字体
CookBook
应当至少在使用的 font-family 的属性值列表中添加一个通用的字体族名，因为无法保证用户的计算机内已经安装了指定的字体，也不能保证使用 @font-face提供的字体能够正确地下载。提供通用的字体族使得浏览器可以在无法得到最佳字体的情况下使用一个相对接近的备选字体。
当然这个备选字体一般在列表的最后，因为这样做可以使得选择他的优先级是最低的。
示例
.serif {
font-family: Times, "Times New Roman", Georgia, serif;
}
