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)