CSS 的局限性：利用字体的全部特性
2012年1月18日 3:53
- 0
由于提供了对 CSS3 @font-face 规则和 WOFF 字体封装格式的跨浏览器支持，现代的 Web 版式已远远超出了“Web 安全字体”所定义的范畴，像 New Yorker 这样的知名杂志就使用了 Web 字体来彰显标题版式的独特风格，而在美国总统奥巴马的竞选连任活动中，也使用了 Web 字体服务 Typekit 来托管其独具一格的字体。
妨碍 Web 设计人员利用字体的全部特性的一项限制是：无法访问许多字体中内置的大量可选 OpenType® 特性。这些特性定义了字形替代和定位选项，以支持基本的版式特性（如字距调整、上标和下标）、上下文字形（如连写、数字样式）以及访问可选的东亚字形和花饰字体。
例如，Gabriola 中内置的 OpenType“样式集”可将以下文本：
…呈现为：
对 CSS3 字体模块的最新更新包含了一组可以在 CSS 中公开这些 OpenType 特性的属性。这些属性可以粗略地归为以下两种类别：
- 常见 OpenType 特性与具体属性和值的显式映射。例如，font-kerning:normal 适用于在字体中以代码形式进行字符对间距调整，而 font-variant-numeric:tabular-nums 可启用表格用数字。
- font-feature-settings 属性，可以在底层访问字体支持的所有 OpenType 特性。该属性就像一个“紧急逃生舱口”，利用该属性可以访问通常很少使用的更多高级特性。
CSS 属性：font-feature-settings
IE10 预览版第 4 版包含了对 font-feature-settings 属性的支持。我们之前提供的 Gabriola 示例可以按以下形式编写：
p#demo {
font-family: Gabriola, cursive;
font-size: 24pt;
-ms-font-feature-settings: "ss06" 1;
}
上面的 -ms-font-feature-settings 声明启用了该字体支持的样式集 (ss06)。该属性的值可以为“normal”（对字形选项和定位选项不作任何更改）或由一个或多个特性（以逗号分隔）构成的特性列表。每一种特性均由一个 4 字符 OpenType 特性标记和一个值组成。在上面的示例中，“ss06”是样式集 6 的 OpenType 特性标记。我们为该特性赋值 1，表示启用该特性。
OpenType 特性注册表定义了可使用的标记列表（在此处归档并由 ISO 进行标准化）。以下列出了最常用的一些标记：
OpenType 标记 | 作用 |
| 字距调整 |
| 标准连写 |
| 自由连写 |
| 小型大写 |
| 下标 |
| 上标 |
| 花体 |
样式集 1 至 20 |
有关这些特性及许多其他特性的介绍，建议您参阅 FontFont OpenType User Guide（FontFont OpenType 用户指南）的“Layout Features”（版式特性）一节。
较为常用的特性都带有 on/off 开关。特性值为 off 或 0 表示禁用该特性；特性值为 on 或任何正整数表示启用该特性。对于某些特性，整数值表示访问一些选项。通常花体 (‘swsh’) 会存在多个选项的情况。如果没有为特性指定值，则假定值为 1。因此，以下所有声明均与我们的 Gabriola 示例具有同等效果：
-ms-font-feature-settings: "ss06" 1;
-ms-font-feature-settings: "ss06" on;
-ms-font-feature-settings: "ss06";
查找字体支持的特性
Adobe InDesign 或 Illustrator 等设计工具通过用户友好的菜单和对话框公开了 OpenType 特性，Word 等字处理软件可以通过字体选择对话框选择这些特性，而字体供应商通常也会公开其产品支持的特性。我们将在后续博文中讨论如何使用浏览器来检测字体特性。随着越来越多的浏览器支持访问 OpenType 特性，我们期待字体托管服务能够在字体宣传和应用推广方面发挥更大的作用。
浏览器支持
当前，Firefox 4+ 和 Internet Explorer 10（从预览版第 4 版开始）支持 font-feature-settings 属性。请注意，由于 Firefox 和 IE 实现的草案版本有所不同，因此二者可接受的值语法也存在一些差异。例如，要在这两种浏览器中启用字间距调整，需要添加以下代码：
-ms-font-feature-settings: "kern" 1;
-moz-font-feature-setting: "kern=1";
有关 –moz-font-feature-settings 的详细信息，请参阅 -moz-font-feature-settings。
随着 CSS3 字体标准化进程的发展，我们预计会有更多的浏览器提供对 font-feature-setttings 以及该模块中定义的更多便于创作人员使用的字体变体属性和值的支持。
另外请注意，该属性适用于所有字体系列，无论是通过 @font-face 规则下载的 Web 字体还是按名称引用的本地字体，均可使用该属性。
演示
我们的 IE 体验网站包含了 Monotype Imaging、FontFont 和 The Font Bureau 提供的高级 OpenType 特性演示。这些演示展示了现代字体提供的各种版式设计。
您无需安装任何特殊字体即可进行尝试。Windows 7 包含了大量已启用 OpenType 的字体，包括 Calibri、Cambria、Consolas、Gabriola 和 Palatino Linotype。在 Windows 8 开发人员预览版中，我们为 Segoe UI 以及 Web 安全字体 Arial、Verdana、Georgia、Times New Roman、Comic Sans 和 Trebuchet 增加了 OpenType 特性。
能够为 Web 创作人员提供对 Web 字体内置的 OpenType 特性的访问，我们感到非常激动，我们将继续努力，提供更加广阔的 Web 版式设计空间。
—Internet Explorer 项目经理 Sylvain Galineau
