css властивість font-variant-alternates


Властивість font-variant-alternates дозволяє вам керувати вибором альтернативних гліфів для певного символу в шрифті.

font-variant-alternates є однією із властивостей у CSS3, які використовуються для ввімкнення різних функцій, пов'язаних зі шрифтом та покращення зовнішнього вигляду тексту на сторінці.

Для будь-якого заданого символу шрифти можуть надавати різні альтернативні гліфи, окрім стандартного гліфу. Властивість font-variant-alternates дозволяє вибрати, який конкретний гліф вам потрібен для даної ситуації.

автор: Svitlana

Синтаксис

font-variant-alternates: normal | [ stylistic(<feature-value-name>) || historical-forms || styleset(<feature-value-name> #) || character-variant(<feature-value-name> #) || swash(<feature-value-name>) || ornaments(<feature-value-name>) || annotation(<feature-value-name>) ]

Властивість font-variant-alternates може отримувати 8 значень:

normal

Жодна з перерахованих нижче функцій не ввімкнена.

автор: Svitlana

stylistic(<feature-value-name>)

Дозволяє відображати стилістичні альтернативи (специфікація шрифту, функція OpenType: salt <feature-index>).

автор: Svitlana

historical-forms

Вмикає відображення історичних форм (функція OpenType: hist).

автор: Svitlana

styleset(<feature-value-name> #)

Дозволяє відображати стилістичні набори (специфікація шрифту, функція OpenType: ss<function-index> OpenType в даний час визначає ss01 через ss20).

автор: Svitlana

character-variant(<feature-value-name> #)

Дозволяє відображати певні варіанти символів (специфікація шрифтів, функція OpenType: cv<feature-index> OpenType в даний час визначає cv01 через cv99).

автор: Svitlana

swash(<feature-value-name>)

Дозволяє відображати гліфи swash (специфікація шрифту, функція OpenType: swsh<feature-index>, cswh).

автор: Svitlana

ornaments(<feature-value-name>)

Дозволяє замінити гліфи за замовчуванням з орнаментами, якщо вони представлені в шрифті (специфікація шрифту, функція OpenType: ornm<function-index>).

автор: Svitlana

annotation(<feature-value-name>)

Дозволяє відображати альтернативні форми анотацій (специфічна для шрифтів, функція OpenType: nalt<feature-index>).

автор: Svitlana

Значення без задання: normal
Наслідує: Так
Анімується: Ні
JavaScript синтаксис: object.style.fontVariantAlternatives = ' ';

Переглядачі

Підтримка: стаціонарні переглядачі
Переглядач Google Chrome Mozilla Firefox Apple Safari Opera Microsoft EDGE Microsoft Internet Explorer
font-variant-alternates Не підтримується 34.0 Не підтримується Не підтримується Не підтримується Не підтримується
Підтримка: мобільні переглядачі
Переглядач Mobile Google Android Mobile Mozilla Firefox Mobile Apple Safari
font-variant-alternates Не підтримується 34.0 Не підтримується

Приклади

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

swash() вмикає декоративні розчерки, оголошені в @font-feature-values. Потрібен шрифт із такими гліфами (наприклад, декоративні гарнітури) — системні шрифти зазвичай без них, тож рядки можуть збігатися.

HTML

<p>Звичайне накреслення: Quality Rare gift</p>
<p class="swash">Зі swash(fancy): Quality Rare gift</p>

CSS

@font-feature-values "Custom Font" {
    @swash {
        fancy: 1;
    }
}

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

.swash {
    font-variant-alternates: swash(fancy);
}
автор: Svitlana

Коментарі

Коментарів ще немає — будьте першим!

Відповідь для

Увійдіть — коментар з'явиться одразу, без капчі й очікування перевірки.

Пропозиція правки

Ваша версія — : після перевірки замінить чинну. Нова порада чи нотатка — з'явиться на сторінці після перевірки.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія секції «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія опису «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Зворотний зв'язок
Вхід