CSS 字体
为您的网站选择合适的字体很重要！
字体选择很重要
选择合适的字体对读者体验网站的方式有很大影响。
合适的字体可以为您的品牌创造强烈的身份。
使用易于阅读的字体很重要。字体为您的文本增加价值。选择合适的字体颜色和文本大小也很重要。
通用字体系列
在 CSS 中有五个通用字体系列
- 衬线 字体在每个字母的边缘都有一个小笔画。它们营造出正式和优雅的感觉。
- 无衬线 字体线条干净（没有小的笔画）。它们创造出现代和极简的外观。
- 等宽 字体 - 这里所有字母都具有相同的固定宽度。它们营造出机械感。
- 草书 字体模仿人类的笔迹。
- 幻想 字体是装饰性的/俏皮的字体。
所有不同的字体名称都属于其中一个通用字体系列。
衬线和无衬线字体之间的区别
注意：在电脑屏幕上，无衬线字体被认为比衬线字体更容易阅读。
一些字体示例
| 通用字体系列 | 字体名称示例 |
|---|---|
| 衬线 | Times New Roman Georgia Garamond |
| 无衬线 | Arial Verdana Helvetica |
| 等宽 | Courier New Lucida Console Monaco |
| 草书 | Brush Script MT Lucida Handwriting |
| 幻想 | Copperplate Papyrus |
CSS font-family 属性
在 CSS 中，我们使用 font-family 属性指定文本的字体。
注意：如果字体名称超过一个词，则必须用引号括起来，例如："Times New Roman"。
提示：font-family 属性应包含几个字体名称作为“备用”系统，以确保浏览器/操作系统之间的最大兼容性。从您想要的字体开始，以一个通用系列结束（如果其他字体不可用，让浏览器选择通用系列中的类似字体）。字体名称应以逗号分隔。在下一章中了解更多关于备用字体的信息。
示例
为三个段落指定一些不同的字体
.p1 {
font-family: "Times New Roman", Times, serif;
}
.p2 {
font-family: Arial, Helvetica, sans-serif;
}
.p3 {
font-family: "Lucida Console", "Courier New", monospace;
}
自己尝试 »
