在浏览器中使用 OpenType 字体

Question

我想使用的特定字体种类（带连字）仅可用作 OpenType。

我正在尝试确定哪些浏览器能够正确显示它，以及我应该如何将它添加到 CSS。

我在 2012 年 7 月找到了这篇文章，其中包含 Paul Irish 等人的贡献，表明它可能具有权威性：

http://www.typotheque.com/articles/opentype_features_in_web_browsers

但我不明白它在 OpenType 字体和 OpenType 功能之间的区别：

But while all modern browsers can display OpenType *fonts*, only Firefox 
(since version 4) [1], Internet Explorer 10 (preview version)[2] and 
the latest versions of Google Chrome[12] are currently able to display 
OpenType *features*. 

所以：

1. 我可以在现代浏览器中使用这种 OpenType 字体吗？OpenType 字体和功能之间有什么区别？我希望能够显示 ASCII 字符和连字。
2. 我应该如何在 CSS 中实际包含这种 OpenType 字体？

Answer 1

在浏览器中使用您的字体（您可以合法用作可下载字体的字体）的实用方法是使用 FontSquirrel @font-face Generator 之类的服务来创建所需的不同字体格式并使用它生成的 CSS 代码, 酌情处理（如果您使用斜体、粗体或任何其他非常规字体，则可能需要进行调整）。

如果字体最初包含连字定义并且转换器保留了信息（转换后您需要运行一些测试），则在现代版本的 Firefox 中将默认使用“标准”连字。要让 Chrome 和 Safari 使用它们，请添加 CSS 声明

text-rendering: optimizeLegibility

（适用于应使用连字呈现的任何元素），并涵盖 IE 10，还添加

-ms-font-feature-settings: "liga";

为了安全起见，还要添加建议的标准设置：

font-feature-settings: "liga";

我认为这为您提供了现在或不久的将来所能获得的一切。

如果字体包含上下文 ( clig)、任意 ( dlig) 或历史 ( hlig) 连字的定义，您可以在某些浏览器上启用它们。例如，除了标准连字外，以下内容还启用自由连字：

-ms-font-feature-settings: "liga", "dlig";
-webkit-font-feature-settings: "liga", "dlig";
-moz-font-feature-settings: "liga", "dlig";
font-feature-settings: "liga", "dlig";

您可以使用Google 网络字体Source Sans Pro测试这些，它具有“ff”和“ft”的标准连字（至少在足够大的字体大小下与非连字渲染区分开来）。

关于理论，OpenType 是一种规范和字体格式，它允许将排版信息嵌入到字体文件等中。浏览器可能支持该格式，但不支持使用嵌入信息。