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

Posted 2023-03-15

【中文标题】如何设置默认字体功能设置？

【英文标题】：How to set default font feature settings?

【发布时间】：2015-02-13 16:54:36

【问题描述】：

如何设置每种字体的默认字体功能设置？

我在当前项目中使用了两种不同的字体，并希望在它们上启用字体功能设置。 目前我必须通过* 选择器来做到这一点：

*, *: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";

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

我的首选方法是在 @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 中对此进行了测试，但它不起作用。有没有办法为每种字体声明默认的字体功能设置？

【参考方案1】：

你试过的方法是可以的，但是Chrome和IE都不支持； Firefox 可以。

CSS Fonts Module Level 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

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

【讨论】：

“规范的模糊性”是什么意思？我同意你的解释。更清楚一点：dev.w3.org/csswg/css-fonts/#font-rend-desc 为 font-feature-settings 描述了“这些描述符定义了在呈现 @font-face 规则定义的字体时应用的初始设置。”。

@Abrax5，我指的是 @font-face 规则缺少明确的语法定义。给出的语法说它包含“描述符声明”，其形式为 property: expression，但它没有说明其中可能出现哪些属性。其意图显然是可能会出现第 4 节中列出的属性，但不会出现其他 CSS 属性。

感谢您说明这一点。我试图在规范中搜索正确的实现，但没有找到。 “规范的模糊性”是一个恰当的描述。我希望这将在不久的将来在所有浏览器中实现。这会让很多事情变得更容易……

请注意，从未支持过-o-font-feature-settings in Presto。通过切换到 Blink Opera 15 开始支持-webkit-font-feature-settings。