Фигуры старого образца (онум) не работают в Chrome

Использование функции OpenType старого стиля с font-feature-settings: "onum" не работает в Chrome. Он работает во всех других основных браузерах, таких как Safari для Mac и iOS и Firefox.

Как можно активировать цифры в старом стиле в веб-шрифте, который также будет работать в Chrome?

цифры OpenType

Вот пример:

@font-face {
  font-family: "Garamond Premier Pro Display";
  font-weight: 700;
  font-style: normal;
  font-feature-settings: "onum"; /* Activate oldstyle figures */
  src: url("https://use.typekit.net/af/6abdec/00000000000000003b9ade3b/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2")
}

html, body { height: 100% }

body {
  display: grid;
  place-items: center
}

h1 { font: 700 calc(9rem / 2)/1 "Garamond Premier Pro Display" }
<h1>1776</h1>


google-chrome css typography webfonts opentype
person Tzar    schedule 11.11.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я публикую вопросы и ответы для тех, кто борется с этим. После долгих проб и ошибок я понял, как это сделать.

Чтобы активировать цифры старого стиля в Chrome, нужно использовать:

font-variant-numeric: oldstyle-nums


@font-face {
  font-family: "Garamond Premier Pro Display";
  font-weight: 700;
  font-style: normal;
  font-feature-settings: "onum"; /* Activate oldstyle figures */
  src: url("https://use.typekit.net/af/6abdec/00000000000000003b9ade3b/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2")
}

html, body { height: 100% }

body {
  display: grid;
  place-items: center
}

h1 {
  font: 700 4.5rem/1 "Garamond Premier Pro Display";
  font-variant-numeric: oldstyle-nums /* Activate oldstyle figures in Chrome */
}
<h1>1776</h1>

person Tzar    schedule 11.11.2019
comment
чтобы объяснить, почему, developer.mozilla .org/en-US/docs/Web/CSS/font-variant содержит полный список параметров. - person Mike 'Pomax' Kamermans; 20.11.2019
comment
@Mike'Pomax'Kamermans Кроме того, developer.mozilla. org/en-US/docs/Web/CSS/font-variant-numeric - person Tzar; 20.11.2019