如何从 HTML 中的 OpenType 字体调用“Swash”/“风格集”字符？答案

【问题标题】：How can I call 'Swash'/'Stylistic Set' Characters from an OpenType font in HTML?如何从 HTML 中的 OpenType 字体调用“Swash”/“风格集”字符？
【发布时间】：2012-02-03 17:40:56
【问题描述】：

我现在正在处理一个项目，在 OpenType 字体中具有相同字符的多个变体。所有字符都具有相同的 Unicode ID，但具有不同的 GID 编号和其他一些参考，例如 Swash 或 Stylistic SetXX (ss01)（在 indesign 中找到此信息）。有没有办法在 HTML 文档中使用这些字符？

示例：J（正常）、J（带速度模糊）、J（由链组成），均具有 unicode id：004A，但 GID 值分别为 43、206 和 233。

【问题讨论】：

标签： html xhtml css fonts opentype

【解决方案1】：

font-variant-alternates 是你想要的：http://www.w3.org/TR/css3-fonts/#font-variant-alternates-prop

我不知道它的支持范围有多广，我敢打赌它不在 IE 中。

此页面一般显示对 OTF 的支持：http://caniuse.com/#feat=ttf；从这个意义上说，尚不清楚完全支持是否真的完全。

Firefox 和 IE 支持演示：http://ie.microsoft.com/testdrive/Graphics/opentype/opentype-fontfont/index.html

【讨论】：

“不要引用此文档，除非它是在进行中的工作。” - W3C
@Alerty：你的意思是什么？您是否知道实际人们使用的实际浏览器已经支持大部分 CSS3 和 HTML5，即使这些标准正在制定中。
只是想说明字体功能还没有广泛实现的事实。
@Alerty：谢谢，您可能注意到我在两行的第二行中提到了这一点。
这是我一直在寻找的答案，但它似乎在任何浏览器中都不受支持（至少我无法让它工作[有其他人尝试过吗？]）。感谢您的努力。

【解决方案2】：

我没有听说过font-variant-alternates，但我知道Firefox 4 and above support -moz-font-feature-settings，它允许您通过 CSS 应用 OpenType 功能。

来自Mozilla Hacks blog post on moz-font-feature-settings 的示例代码：

.altstyles {
    /* format: feature-tag=[0,1] with 0 to disable, 1 to enable */
    /* dlig = discretionary ligatures, ss01 = stylistic set 1 */
    -moz-font-feature-settings: "dlig=1,ss01=1";
}

据我所知，目前还没有其他浏览器支持类似的功能。

【讨论】：

谢谢。不幸的是，我正在做的项目只支持-webkit。对 font-variant-alternates 的支持似乎并不高。我几乎没有发现任何人在谈论它。
@AdeptOfHermes：啊，当然。很遗憾 WebKit 还没有任何等价物。你会认为随着@font-face 的使用越来越多，这类事情的呼声就会越来越高。