css властивість font-variant-numeric
Властивість font-variant-numeric дозволяє контролювати стиль відображення чисел на сторінці.
Властивість font-variant-numeric є однією із властивостей у CSS3, які використовуються для ввімкнення різних функцій, пов'язаних зі шрифтом та покращення зовнішнього вигляду тексту на сторінці. У даному випадку властивість застосовується для чисел.
Синтаксис
font-variant-numeric: normal | [ <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero ]Властивість font-variant-numeric може отримувати 6 значень:
normalВказує, що жодна з наведених нижче функцій не активована.
ordinalЦе ключове слово зумовлює використання спеціальних гліфів для порядкових маркерів.
slashed-zeroЦе ключове слово призводить до використання 0 (нуля) з косою рискою всередині символу (перекресленням).
<numeric-figure-values>lining-nums- дозволяє відображати звичайні цифри.oldstyle-nums- вмикає відображення старих цифр.<numeric-spacing-values>proportional-nums- дозволяє відображати пропорційні цифри.tabular-nums- вмикає відображення табличних чисел.<numeric-fraction-values>diagonal-fractions- активізуює набір фігур, де чисельник і знаменник зменшені і розділені косою лінією.stacked-fractions- активізує набір фігур, де чисельник і знаменник зменшені, та розділені горизонтальною лінією.
| Значення без задання: | normal |
|---|---|
| Наслідує: | Так |
| Анімується: | Ні |
| JavaScript синтаксис: | object.style.fontVariantNumeric |
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| font-variant-numeric | 52.0 |
Не підтримується |
34.0 |
39.0 |
9.1 |
Не підтримується |
| Переглядач | |||
|---|---|---|---|
| font-variant-numeric | 52.0 |
52.0 |
34.0 |
Мобільних переглядачів ще не додано.
Приклади
Значення у дії
Приклад використання
Приклад використання
See the Pen
yGmWOB by css.in.ua (@css_in_ua)
on CodePen.
Синтаксис
font-variant-numeric: normal
font-variant-numeric: ordinal
font-variant-numeric: slashed-zero
font-variant-numeric: lining-nums
font-variant-numeric: oldstyle-nums
font-variant-numeric: proportional-nums
font-variant-numeric: tabular-nums
font-variant-numeric: diagonal-fractions
font-variant-numeric: stacked-fractions
font-variant-numeric: oldstyle-nums stacked-fractions
font-variant-numeric: initial
font-variant-numeric: inherit
font-variant-numeric: unset