#### 1. 前言 --- `font-family` 属性用于给元素指定字体，是开发中使用非常频繁的一个属性 该属性的值是一个字体系列，每个值使用逗号隔开，如果字体名名称包含空格，那么字体名称必须使用引号包裹，设置的字体是否可用取决于用户机器上该字体是否可用 #### 2. 给英文，中文设置不同的字体 --- 众所周知，`font-family` 属性的原则是客户端不支持前面的字体时，自动往后查找可以使用的字体 如果想要给英文，中文设置不同的字体，可以使用一个仅支持的英文的字体（比如: Arial），再找一个支持中文的字体 如下所示: 遇到文字时，首选会尝试使用 Arial 字体，该字体支持英文，所以遇到英文会生效，遇到中文时 Arial 不支持，将自动使用后面的 Noto Sans SC（思源黑体） 字体 ```css :root { font-family: Arial, 'Noto Sans SC'; } ``` #### 3. 思源黑体 --- 通过 link 标签在网页头部引用 `Google Web Font` 字体: Noto Sans SC 大小: 100,300,400,500,700,900 ```html <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:100,300,400,500,700,900"> ``` 在需要使用思源黑体的地方使用 CSS 设置字体 ```css font-family: 'Noto Sans SC'; ```