CSS 网页安全字体
网络安全字体是极为常见的字体，最有可能出现在Windows，Mac，Linux等各种操作系统上。
为什么选择Web安全字体
当您试图在网页上使用的字体未按应有的样子出现时，可能是一种情况，因为并非所有计算机系统都提供所有字体。
为了确保在大多数浏览器或操作系统上准确呈现文本，您必须非常仔细地定义字体。该font-familyCSS属性可以容纳几种字体名作为备用系统。首先从所需首选字体开始，然后在首选字体不可用时,采用后备字体。
您应该始终使用通用字体系列来作为font-family的属性值，其中有五个：serif，sans-serif，monospace，cursive和fantasy。如果没有您定义的字体，则通用字体系列允许浏览器选择相似的字体。
下表列出了最安全使用的字体组合。
| 字体系列 | 正常 | 加粗 |
|---|---|---|
| Arial, Helvetica, sans-serif | 这是普通文字。 | 这是粗体文本。 |
| "Times New Roman", Times, serif | 这是普通文字。 | 这是粗体文本。 |
| "Courier New", Courier, monospace | 这是普通文字。 | 这是粗体文本。 |
下面的示例显示如何以font-family正确的方式设置属性。
.sans-serif-font {
font-family: Arial, Helvetica, sans-serif;
}
.serif-font {
font-family: "Times New Roman", Times, serif;
}
.monospace-font {
font-family: "Courier New", Courier, monospace;
}测试看看‹/›常用字体组合
下表列出了一些按通用系列组织的常用字体组合。
Serif 字体
| 字体系列 | 正常 | 加粗 |
|---|---|---|
| Georgia, serif | 这是普通文字。 | 这是粗体文本。 |
| "Times New Roman", Times, serif | 这是普通文字。 | 这是粗体文本。 |
| "Palatino Linotype", Palatino, "Book Antiqua", serif | 这是普通文字。 | 这是粗体文本。 |
Sans-Serif字体
| 字体系列 | 正常 | 加粗 |
|---|---|---|
| Arial, Helvetica, sans-serif | 这是普通文字。 | 这是粗体文本。 |
| "Arial Black", Gadget, sans-serif | 这是普通文字。 | 这是粗体文本。 |
| Impact, Charcoal, sans-serif | 这是普通文字。 | 这是粗体文本。 |
| Tahoma, Geneva, sans-serif | 这是普通文字。 | 这是粗体文本。 |
| "Trebuchet MS", Helvetica, sans-serif | 这是普通文字。 | 这是粗体文本。 |
| Verdana, Geneva, sans-serif | 这是普通文字。 | 这是粗体文本。 |
Monospace 等宽字体
| 字体系列 | 正常 | 加粗 |
|---|---|---|
| Courier, monospace | 这是普通文字。 | 这是粗体文本。 |
| "Courier New", Courier, monospace | 这是普通文字。 | 这是粗体文本。 |
| "Lucida Console", Monaco, monospace | 这是普通文字。 | 这是粗体文本。 |
Cursive 草书字体
| 字体系列 | 正常 | 加粗 |
|---|---|---|
| "Comic Sans MS", cursive | 这是普通文字。 | 这是粗体文本。 |
| "Courier New", Courier, monospace | 这是普通文字。 | 这是粗体文本。 |
| "Lucida Console", Monaco, monospace | 这是普通文字。 | 这是粗体文本。 |
Fantasy字体
不存在跨浏览器和操作系统具有良好可用性的Fantasy字体。
警告：字体（Verdana，Georgia，“ Comic Sans MS”，“ Trebuchet MS”，“ Arial Black”，Impact）在Windows和MacOS上有效，但在Unix + X上无效。