CSS function ornaments()
Опис
Функція ornaments() є ключовою властивістю у CSS, яка надає можливість використовувати орнаменти в тексті, такі як флерони та інші декоративні гліфи (dingbat). Вона дозволяє додавати візуальний стиль та декорувати текст, збагачуючи його візуальний вигляд. Параметром цієї функції є назва, специфічна для шрифту, яка відповідає числовому значенню. Ця назва відповідає значенню ornm у специфікації OpenType, наприклад, ornm 2.
Один із практичних прикладів використання функції ornaments() можна побачити у наступному CSS-виразі:
p {
font-variant-alternates: ornaments(user-defined-ident);
}
У цьому випадку, user-defined-ident є значенням, яке визначається користувачем і відповідає конкретному орнаменту. Воно пов'язане з числовим індексом, визначеним у @font-feature-values at-rule для відповідного шрифту. Таким чином, можна застосувати відповідний орнамент до вибраних символів у тексті.
Загалом, використання функції ornaments() дозволяє застосовувати орнаменти до тексту, додаючи йому декоративний ефект та збагачуючи відображений контент. Кожен орнамент пов'язаний з певним числовим індексом, який визначається шрифтом. Застосування цієї функції може привести до зростання естетичної варіативності у ваших текстових матеріалах, надаючи їм додаткову декоративніст
| Нотатка: | Значення, передане в |
| Нотатка: | Не всі шрифти підтримують стилізовані варіанти орнаментів. Перед використанням цієї функції важливо перевірити, чи підтримує шрифт цю можливість. |
| Нотатка: | Підтримка цієї функції може відрізнятися в різних браузерах. |
Синтаксис
ornaments(<feature-value-name>);<feature-value-name>Назва стилізованого варіанту орнаменту, який був визначений в директиві
@font-feature-valuesдля даного шрифту.
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
111 |
34 |
16.2 |
97 |
111 |
| Переглядач | ||||
|---|---|---|---|---|
111 |
111 |
34 |
16.2 |
Мобільних переглядачів ще не додано.
Приклади
У цьому прикладі, salt відповідає числовому індексу, який визначає стилістичну альтернативу символів. Вона буде застосована до вибраних символів у елементах p.
@font-feature-values Custom Font {
@ornaments {
salt: 1;
}
}
p {
font-family: 'Custom Font', serif;
}
p.variant {
font-variant-alternates: ornaments(salt);
}