css властивість font-variant-position
Властивість font-variant-position використовується для вводу індексів гліфів.
Однією з розширених функцій шрифтів OpenType є підтримка професійно розроблених символів підкреслення та надписів. Вони розроблені таким чином, щоб бути візуально сумісними з повнорозмірними фігурами з точки зору ваги та пропорцій. Ці гліфи призначені для викладання на тому ж базовому рівні, що і стандартні гліфи, без зміни розміру або перестановки базової лінії.
Властивість font-variant-position дозволяє нам скористатися цими правильними індексами та надписів.
Без належних гліфів, браузер мусить брати нормальний гліф, змінювати розмір і його базову лінію. Зазвичай це не дає найоптимальніший результат. Гліф часто виглядає трохи непропорційно, і його переміщення може вплинути на висоту базової лінії. Професійно розроблені гліфи допомагають подолати ці проблеми.
Деякі шрифти мають лише базову підтримку цифр, а інші містять підкреслення та надрядкові гліфи для повного набору букв, цифр та пунктуації. Якщо якийсь варіант гліфа не доступний, браузер буде імітувати гліфи для всіх символів (так само, як це було б, якщо ця функція не була застосована або доступна). Це запобігає суміші правильних варіантів гліфів і синтезованих.
Синтаксис
font-variant-position: normal | sub | superВластивість font-variant-position може отримувати 3 значення:
normalЖодна з перерахованих нижче функцій не ввімкнена.
subВмикає відображення нижніх індексів.
superВмикає відображення верхніх індексів.
| Значення без задання: | normal |
|---|---|
| Наслідує: | Так |
| Анімується: | Ні |
| JavaScript синтаксис: | object.style.fontVariantPosition |
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| font-variant-position | Не підтримуться |
Не підтримуться |
34.0 |
Не підтримуться |
Не підтримуться |
Не підтримуться |
| Переглядач | |||
|---|---|---|---|
| font-variant-position | Не підтримуться |
34.0 |
Не підтримуться |
Мобільних переглядачів ще не додано.
Приклади
Значення у дії
Приклад використання
Синтаксис
font-variant-position: normal;
font-variant-position: sub;
font-variant-position: super;
font-variant-position: inherit;
font-variant-position: initial;
font-variant-position: unset;