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 offont-variant-alternates
. A stylistic feature value definition allows only one value:ident1: 2
is valid, butident2: 2 4
isn't. @styleset
- Specifies a feature name that will work with the
styleset()
functional notation offont-variant-alternates
. A stylset feature value definition allows an unlimited number of values:ident1: 2 4 12 1
maps to the OpenType valuesss02
,ss04
,ss12
, andss01
. Note that values higher than99
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 offont-variant-alternates
. A character-variant feature value definition allows either one or two values:ident1: 3
maps tocv03=1
, andident2: 2 4
maps tocv02=4
, butident2: 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' в этой спецификации. |
Кандидат в рекомендации | Начальное определение. |
Совместимость с браузерами
Компьютеры | Мобильные | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
@font-feature-values | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@annotation | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@character-variant | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@historical-forms | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@ornaments | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@styleset | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@stylistic | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
@swash | Chrome Нет поддержки Нет | Edge Нет поддержки Нет | Firefox
Полная поддержка
34
| IE Нет поддержки Нет | Opera Нет поддержки Нет | Safari Полная поддержка 9.1 | WebView Android Нет поддержки Нет | Chrome Android Нет поддержки Нет | Firefox Android
Полная поддержка
34
| Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 9.3 | Samsung Internet Android Нет поддержки Нет |
Легенда
- Полная поддержка
- Полная поддержка
- Нет поддержки
- Нет поддержки
- Экспериментальная. Ожидаемое поведение может измениться в будущем.
- Экспериментальная. Ожидаемое поведение может измениться в будущем.
- Пользователь должен сам включить эту возможность.
- Пользователь должен сам включить эту возможность.
Смотрите также
- Свойство
font-variant-alternates
которое использует значения, определенные этим правилом.