font-family · 跟老司机学CSS3

**font-family** * 描述：设置对象中文本的字体名称序列。 * 版本：CSS1 * 继承性：有 **语法** ``` font-family：字体值 ``` 字体值 * family-name：字体名称，按优先顺序排列，以逗号分隔，如果字体名称包含空格或中文，则应使用引号引起。比如：`arial | georgia | verdana | helvetica | simsun` * generic-family：字体序列名称。比如：`cursive | fantasy | monospace | serif | sans-serif ` **使用说明** 字体序列也可包含嵌入字体。一般字体引用可以不加引号，如果字体名包含了空格、数字或者符号（如连接符）则需加上引号，避免引发错误。 user agent会遍历定义的字体序列，直到匹配到某个字体为止。设置字体序列用法： `p { font-family: helvetica, verdana, sans-serif; } ` 如上，假设机器上没有 helvetica 字体，但有 verdana，这时将会以 verdana 显示你的文字。 **代码示例** ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>font-family</title> <style> #container{ font-size: 20px; } #container .p1{ font-family: '黑体', verdana, sans-serif; } #container .p2{ font-family: "Microsoft YaHei", sans-serif ; } </style> </head> <body> <div id="container"> <p class="p1">测试字体</p> <p class="p2">测试字体</p> </div> </body> </html> ``` ![font-family](https://box.kancloud.cn/244324b6454ce72082e4236b1b7c10e0_143x95.png)