CSS function stylistic

Опис

Функція stylistic() у CSS є потужним інструментом, що надає можливість використовувати стилістичні альтернативи для окремих символів у тексті. Вона є частиною набору властивостей для управління шрифтами і може застосовуватися для створення унікальних візуальних ефектів. Параметром цієї функції є назва, специфічна для шрифту, яка відповідає числовому значенню. Ця назва відповідає значенню salt у специфікації OpenType, наприклад, salt 2.

Ось як можна використовувати функцію stylistic() у практичному застосуванні:

p {
  font-variant-alternates: stylistic(user-defined-ident);
}

У цьому прикладі, user-defined-ident є значенням, яке визначається користувачем і відповідає конкретній стилістичній альтернативі. Воно пов'язується з числовим індексом, визначеним у @font-feature-values at-rule для відповідного шрифту. Таке використання дозволяє застосовувати відповідну стилістичну альтернативу до вибраних символів у тексті.

Використання функції stylistic() відкриває нові можливості для змінювання вигляду окремих символів у тексті. Кожна стилістична альтернатива пов'язана з певним числовим індексом, який визначається шрифтом. Застосування цієї функції надає дизайнерам велику гнучкість та контроль над відображенням тексту.

правити

Нотатка

Значення, передане в stylistic(), повинно бути визначено в @font-feature-values для даного шрифту.

автор: Bond правити

Нотатка

Не всі шрифти мають стилістичні альтернативи. Перед використанням цієї функції важливо перевірити, чи підтримує шрифт цю можливість.

автор: Bond правити

Нотатка

Підтримка цієї функції може відрізнятися в різних браузерах.

автор: Bond правити

Нотатка

Функція stylistic() є цінним доповненням до інструментарію CSS, що дозволяє дизайнерам та розробникам змінювати вигляд окремих символів у тексті, застосовуючи стилістичні альтернативи, які визначені для конкретного шрифту. Ця можливість може бути використана для створення унікальних і виразних сторінок, які відображають особливий стиль бренду або веб-сайту.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

stylistic(<feature-value-name>);

Функція stylistic може отримувати єдине значення:

<feature-value-name>

Це назва стилістичного варіанту, який був визначений в директиві @font-feature-values для даного шрифту.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	111	34	16.2	97	111

Підтримка: мобільні переглядачі

Переглядач
	111	111	34	16.2

Приклади

+ запропонувати свій приклад у пісочниці

<p>Звичайне накреслення: a g y R Q</p>
<p class="variant">Зі stylistic(alt): a g y R Q</p>

@font-feature-values "Custom Font" {
    @stylistic {
        alt: 1;
    }
}

p {
    font-family: "Custom Font", serif;
}

p.variant {
    font-variant-alternates: stylistic(alt);
}