В процессе перевода.

CSS правило @font-feature-values позволяет использовать общее имя в свойстве font-variant-alternates для функций, которые по разному активируются в OpenType. Это может помочь упростить ваш CSS при использовании нескольких шрифтов.

/* Правило для "хорошего стиля" в Font One */
@font-feature-values Font One {
  @styleset {
    nice-style: 12;
  }
}

/* Правило для "хорошего стиля" в Font Two */
@font-feature-values Font Two {
  @styleset {
    nice-style: 4;
  }
} 

…

/* Применение правилоа с единственым объявлением */
.nice-look {
  font-variant-alternates: styleset(nice-style);
}

Правило @font-feature-values может использоваться как на вернем уровне вашего CSS так и внутри любого условного CSS правила.

Синтаксис

Блоки значений функций

@swash
Устанавливает имя функции, которая будет работать с функциональной записью swash() для font-variant-alternates. Определение значения функции swash допускает только одно значение: ident1: 2 является действительным, но ident2: 2 4 нет.
@annotation
Устанавливает имя фунции, которая будет работать с функциональной записью annotation() для font-variant-alternates. Определение значения функции допускает только одно значение: ident1: 2 действительным , но ident2: 2 4 нет.
@ornaments
Устанавливает имя функции, которая будет работать с функциональной записью ornaments() для font-variant-alternates. Определение значения функции ornaments допускает только одно значение: ident1: 2 является действительным, но ident2: 2 4 нет.
@stylistic
Specifies a feature name that will work with the stylistic() functional notation of font-variant-alternates. A stylistic feature value definition allows only one value: ident1: 2 is valid, but ident2: 2 4 isn't.
@styleset
Specifies a feature name that will work with the styleset() functional notation of font-variant-alternates. A stylset feature value definition allows an unlimited number of values: ident1: 2 4 12 1 maps to the OpenType values ss02, ss04, ss12, and ss01. Note that values higher than 99 are valid, but don't map to any OpenType values and are ignored.
@character-variant
Specifies a feature name that will work with the character-variant() functional notation of font-variant-alternates. A character-variant feature value definition allows either one or two values: ident1: 3 maps to cv03=1, and ident2: 2 4 maps to cv02=4, but ident2: 2 4 5 is invalid.

Формальный синтаксиси

@font-feature-values <family-name># {
  <feature-value-block-list>
}

где
<family-name> = <string> | <custom-ident>+
<feature-value-block-list> = <feature-value-block>+

где
<feature-value-block> = <feature-type> '{' <feature-value-declaration-list> '}'

где
<feature-type> = @stylistic | @historical-forms | @styleset | @character-variant | @swash | @ornaments | @annotation
<feature-value-declaration-list> = <feature-value-declaration>

где
<feature-value-declaration> = <custom-ident>: <integer>+;

Спецификации

Спецификация Статус Комментарий
CSS Fonts Module Level 3
Определение '@font-feature-values' в этой спецификации.
Кандидат в рекомендации Начальное определение.

Совместимость с браузерами

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidEdge MobileFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
Базовая поддержка
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@annotation
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@character-variant
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@historical-forms
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@ornaments
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@styleset
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@stylistic
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет
@swash
Экспериментальная
Chrome Нет поддержки НетEdge Нет поддержки НетFirefox Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Нет поддержки НетSafari Полная поддержка 9.1WebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Нет поддержки НетFirefox Android Полная поддержка 34
Полная поддержка 34
Полная поддержка 24
Отключено
Отключено From version 24: this feature is behind the layout.css.font-features.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Нет поддержки НетSafari iOS Полная поддержка 9.3Samsung Internet Android Нет поддержки Нет

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Пользователь должен сам включить эту возможность.
Пользователь должен сам включить эту возможность.

Смотрите также

  • Свойство font-variant-alternates которое использует значения, определенные этим правилом.

Метки документа и участники

Внесли вклад в эту страницу: mdnwebdocs-bot, Akh-rman
Обновлялась последний раз: mdnwebdocs-bot,