如何为每个字体设置默认字体功能设置？

Question

如何为每个字体设置默认字体功能设置？

我在当前项目中使用两种不同的字体，并希望在这两种字体上启用字体功能设置。目前，我必须通过*选择器执行此操作：

*, *:before, *:after {
  -webkit-font-feature-settings: "kern", "liga", "pnum" "ss01";
     -moz-font-feature-settings: "kern", "liga", "pnum" "ss01";
      -ms-font-feature-settings: "kern", "liga", "pnum" "ss01";
          font-feature-settings: "kern", "liga", "pnum" "ss01";
}

到目前为止一切顺利;这样我将字距调整，连字和比例数设置为默认值。问题是另类风格集。我希望在一个我的字体的每个实例上都有这个。另一种字体有另一种风格集，我不想使用它。

我最喜欢的方法是在@font-face中加入默认值，如下所示：

@font-face {
  font-family: 'FFDin';
  font-weight: normal;
  font-style: normal;

  -webkit-font-feature-settings: "kern", "liga", "pnum" "ss01";
     -moz-font-feature-settings: "kern", "liga", "pnum" "ss01";
      -ms-font-feature-settings: "kern", "liga", "pnum" "ss01";
          font-feature-settings: "kern", "liga", "pnum" "ss01";

  src: url("fonts/DINWeb-Light.eot");
  src: url("fonts/DINWeb-Light.eot?#iefix") format("embedded-opentype"),
       url("fonts/DINWeb-Light.woff") format("woff"),
       url("fonts/DINWeb-Light.ttf") format("truetype");
}

我已经在chrome中对此进行了测试，但它不起作用。有没有办法声明每个字体的默认字体功能设置？

Answer 1

这可能是你尝试过的方式，但Chrome和IE不支持它; Firefox确实。

CSS字体模块级别3有点模糊，因为它不包含@font-face内允许的内容的正式描述，但因为第4节Font Resources似乎是要描述的 @font-face并将font-feature-settings定义为描述符，您的方法应该有效。它也在MDN info on @font-face中描述。然而，W3C CSS验证器拒绝它，可能是由于规范的暗示（候选推荐）。

我使用Google字体Source Sans Pro和ordn功能对此进行了测试。虽然以下代码不会运行，除非您在本地安装了适当的Source Sans Pro，但它在更简单的设置中完善了该方法：

<style>
@font-face {
    font-family: Source Sans Pro;
    src: url('sourcesanspro-regular-webfont.eot');
    src: url('sourcesanspro-regular-webfont.eot?#iefix')  
      format('embedded-opentype'),
    url('sourcesanspro-regular-webfont.woff') format('woff'),
    url('sourcesanspro-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    -webkit-font-feature-settings: "ordn";
       -moz-font-feature-settings: "ordn";
         -o-font-feature-settings: "ordn";
            font-feature-settings: "ordn";   
}
.no-ordn {
    -webkit-font-feature-settings: "ordn" 0;
       -moz-font-feature-settings: "ordn" 0;
         -o-font-feature-settings: "ordn" 0;
            font-feature-settings: "ordn" 0;   
}
.ordn {
    -webkit-font-feature-settings: "ordn";
       -moz-font-feature-settings: "ordn";
         -o-font-feature-settings: "ordn";
            font-feature-settings: "ordn";   
}
p {
    font-family: Source Sans Pro;
}

</style>
<p>1st 2nd 3rd 4th
<p class=no-ordn>1st 2nd 3rd 4th
<p class=ordn>1st 2nd 3rd 4th

第一段应该以第1个第2个第4个字母作为上标字形拍摄，这就是Firefox中发生的情况。第二段仅用于测试某些元素在普通CSS中是否可以覆盖字体上的字体功能集。第三段用于测试浏览器是否支持字体功能。

如何设置默认字体功能设置？

如何为每个字体设置默认字体功能设置？

1 个答案: