网络安全字体是极为常见的字体,最有可能出现在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上无效。