CSS 网页字体
CSS @font-face 规则
网页字体允许网页设计师使用用户计算机上未安装的字体。
当你找到/购买了要使用的字体后，只需将字体文件包含在你的 web 服务器上，它会在需要时自动下载到用户设备上。
你的“自定义”字体在 CSS 的 @font-face 规则中定义。
不同的字体格式
TrueType 字体 (TTF)
TrueType 是由 Apple 和 Microsoft 在 20 世纪 80 年代后期开发的一种字体标准。TrueType 是 Mac OS 和 Microsoft Windows 操作系统中最常见的字体格式。
OpenType 字体 (OTF)
OpenType 是一种可缩放计算机字体的格式。它是在 TrueType 的基础上构建的，是 Microsoft 的注册商标。如今，OpenType 字体在主要计算机平台上普遍使用。
网页开放字体格式 (WOFF)
WOFF 是一种用于网页的字体格式。它在 2009 年开发，现在是 W3C 的推荐标准。WOFF 本质上是 OpenType 或 TrueType，具有压缩和额外的元数据。目标是支持从服务器到客户端的字体分发，以解决带宽限制。
网页开放字体格式 (WOFF 2.0)
TrueType/OpenType 字体，提供比 WOFF 1.0 更好的压缩率。
SVG 字体/形状
SVG 字体允许在显示文本时使用 SVG 作为字形。SVG 1.1 规范定义了一个字体模块，允许在 SVG 文档中创建字体。你还可以将 CSS 应用于 SVG 文档，并且 @font-face 规则可以应用于 SVG 文档中的文本。
嵌入式 OpenType 字体 (EOT)
EOT 字体是 Microsoft 为在网页上作为嵌入式字体使用而设计的 OpenType 字体的紧凑形式。
浏览器对字体格式的支持
表中的数字指定完全支持该字体格式的第一个浏览器版本。
| 字体格式 | |||||
|---|---|---|---|---|---|
| TTF/OTF | 9.0* | 4.0 | 3.5 | 3.1 | 10.0 |
| WOFF | 9.0 | 5.0 | 3.6 | 5.1 | 11.1 |
| WOFF2 | 14.0 | 36.0 | 39.0 | 10.0 | 26.0 |
| SVG | 不支持 | 不支持 | 不支持 | 3.2 | 不支持 |
| EOT | 6.0 | 不支持 | 不支持 | 不支持 | 不支持 |
*IE：该字体格式仅在设置为“可安装”时有效。
使用你想要的字体
在 @font-face 规则中；首先为字体定义一个名称（例如 myFirstFont），然后指向字体文件。
提示：始终为字体 URL 使用小写字母。大写字母可能会在 IE 中产生意想不到的结果。
要将字体应用于 HTML 元素，请通过 font-family 属性引用字体的名称（myFirstFont）。
示例
@font-face {
font-family: myFirstFont;
src: url(sansation_light.woff);
}
div {
font-family: myFirstFont;
}
自己动手试试 »
使用粗体文本
你必须添加另一个 @font-face 规则，其中包含粗体文本的描述符
示例
@font-face {
font-family: myFirstFont;
src: url(sansation_bold.woff);
font-weight: bold;
}
自己动手试试 »
文件“sansation_bold.woff”是另一个字体文件，其中包含 Sansation 字体的粗体字符。
浏览器会在字体系列为“myFirstFont”的文本应呈现为粗体时使用它。
这样，你就可以为同一个字体设置多个 @font-face 规则。
CSS 字体描述符
下表列出了可以在 @font-face 规则中定义的所有字体描述符
| 描述符 | 值 | 描述 |
|---|---|---|
| font-family | 名称 | 必需。为字体定义一个名称 |
| src | URL | 必需。定义字体文件的 URL |
| font-stretch | normal 压缩 超压缩 特压缩 半压缩 扩展 半扩展 特扩展 超扩展 |
可选。定义字体应该如何拉伸。默认值为“normal”。 |
| 字体样式 | normal 斜体 倾斜 |
可选。定义字体应该如何样式化。默认值为“normal”。 |
| 字体粗细 | normal 粗体 100 200 300 400 500 600 700 800 900 |
可选。定义字体的粗细。默认值为“normal”。 |
| Unicode 范围 | Unicode 范围 | 可选。定义字体支持的 UNICODE 字符范围。默认值为“U+0-10FFFF”。 |
