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

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

У типографії, лігатура - це об'єднання знаків двох літер в один друкований символ для гармонійнішого вигляду шрифта в наборі.

Типи лігатури

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

Загальні лігатури

Також називають "стандартними лігатурами", загальні лігатури заміняють послідовність символів з одним гліфом лігатури.

Звичайні лігатури зазвичай використовуються в тих випадках, коли символи стикаються один з одним (або просто виглядають некрасивими), коли вони розміщені поруч один з одним. У таких випадках текст важче читати, особливо при менших розмірах символів.

Наприклад, комбінація літер "f" та "i" часто спричиняє проблеми через крюк (поперечну лінію) "f" та точку "i". Точка "i" має тенденцію потрапляти на шлях гачка "f". Навіть якщо вони фактично не стикаються, вони все ще можуть зменшити читаність тексту. Коли включені лігатури, ці два символи об'єднуються в одне, і разом вони стають більш читабельнішими. Але навіть у випадках, коли розбірливість не є проблемою, звичайні лігатури, як правило, поліпшують зовнішній вигляд тексту і надають їй більш плавне, безперервне відчуття.

Спільні лігатури включені без задання у CSS. Тим не менше, ви можете явно включити / вимкнути їх так:

/* увімкнути */
font-variant-ligatures: common-ligatures;
/* вимкнути */
font-variant-ligatures: no-common-ligatures;

Дискреційні лігатури

Дискреційні лігатури, які також називають "декоративними лігатурами", зазвичай використовуються для чисто декоративних цілей, ніж для розбірливості. Вони призначені для декоративності, а не спеціально для читання.

Ви часто бачите дискреційні лігатури, які використовуються в таких послідовностях, як "ct", "st", "Th" та "sp".

Дискреційна лігатура є необов'язковою - вам потрібно включити їх, якщо ви хочете їх використовувати. Дискреційні лігатури, як правило, використовуються дуже рідко. Оскільки вони можуть досить помітно змінювати зовнішній вигляд тексту, Ви мусите бути обережними з їх використанням.

Як вже згадувалося, дискреційні лігатури без задання відключені в CSS. Нижче наведено код для вмикання / вимикання:

/* увімкнути */
font-variant-ligatures: discretionary-ligatures;
/* вимкнути */
font-variant-ligatures: no-discretionary-ligatures;

Історичні лігатури

Історичні лігатури - це застарілі лігатури, які слід застосовувати на власний розсуд. Історичні лігатури призначені для придання тексту історичного характеру, а не спеціально для читабельності. Бувають дуже подібними до декоративних, або іноді використовуються як такі.

Ви можете включити / вимкнути історичні лігатури, так:

/* увімкнути */
font-variant-ligatures: historical-ligatures;
/* вимкнути */
font-variant-ligatures: no-historical-ligatures;

Змістові альтернативи

Це гліфи, призначені для роботи в контексті сусідніх гліфів. Вони призначені для підвищення читабельності.

Ви можете явно включити / вимкнути контекстні альтернативи, так:

/* увімкнути */
font-variant-ligatures: contextual;
/* вимкнути */
font-variant-ligatures: no-contextual;

правити

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

Синтаксис

font-variant-ligatures: normal | none | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> ]

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

normal

Це ключове слово призводить до активації звичайних лігатур та контекстних форм. Активовані лігатури та форми залежать від шрифту та мови. Це значення без задання.

автор: Svitlana

правити

none

Це ключове слово вказує на те, що всі лігатури та контекстні форми відключені, навіть загальні.

автор: Svitlana

правити

<common-lig-values>

Загальні лігатури (див. вище).

автор: Svitlana

правити

<discretionary-lig-values>

Дискреційні лігатури (див. вище).

автор: Svitlana

правити

<historical-lig-values>

Історичні лігатури (див. вище).

автор: Svitlana

правити

<contextual-alt-values>

Змістові альтернативи (див. вище).

автор: Svitlana

правити

Переглядачі

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

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

Переглядач
font-variant-ligatures	34.0 <br>31.0 -webkit-	34.0	7.0 -webkit-	19.0 -webkit-	10.0

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

Переглядач
font-variant-ligatures	4.4	34.0 -webkit-	7.0 -webkit-

Приклади

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

<p class="liga">Лігатури увімкнено: fi fl ff — official</p>
<p class="noliga">Лігатури вимкнено: fi fl ff — official</p>

p {
    font-size: 26px;
    font-family: Georgia, serif;
}

.liga {
    font-variant-ligatures: common-ligatures;
}

.noliga {
    font-variant-ligatures: none;
}