css властивість font-kerning
Властивість font-kerning використовується для зміни інтервалу між гліфами. На прикладі ми бачимо різницю між першим рядком, до якого застосовані властивості без задання, та другим, для якого ввімкнутий кернінг.
Кернінг - це типографічний термін, який стосується коректування простору між двома гліфами. Ці два символи називаються парами кернінга. Кернінг більш правильно налаштовує цей інтервал.Деякі символи можуть викликати проблеми з проміжками, які виявляються лише в парі з іншим потенційно проблемним глфіом. Пари з літерами, які найчастіше потребують кернінгу, як правило, являють собою комбінації символів верхнього та нижнього регістру, а також пари з пунктуацією. Зауважте, що викликає проблему не один символ, а пара символів.
У більшості шрифтів є вбудована таблиця кернінгу, в якій перераховуються певні пари гліфів та коригування інтервалу, які слід застосувати до них. Шрифт високої якості зазвичай постачається між 500 і 1000 пар кернінга, тому кернінг часто застосовується автоматично. Однак можуть бути випадки, коли ви не бажаєте, щоб кернінг застосовувався автоматично. Ви можете використовувати властивість font-kerning, щоб включити або вимкнути кернінг за необхідності.
- Порада
-
Chrome до версії 33, Opera до версії 20 і Safari підтримують властивість
автор: Svitlana-webkit-font-kerning. - Нотатка
-
Властивість
автор: Svitlanafont-kerningне буде мати видимого ефекту при використанні шрифтів, які не підтримують кернінг гліфів.
Синтаксис
font-kerning: auto | normal | noneВластивість font-kerning може отримувати 3 значень:
-
auto -
Вказує, що кернінг застосовується на розсуд браузера.
автор: Svitlana -
normal -
Вказує, що застосовується кернінг.
автор: Svitlana -
none -
Вказує, що кернінг не застосовується.
автор: Svitlana
| Значення без задання: | auto |
|---|---|
| Наслідує: | Так |
| Анімується: | Ні |
| JavaScript синтаксис: | object.style.fontKerning = ''; |
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 33 | 32 | 9 | 20 | 79 | — |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4.3 | 33 | 32 | 9 |
Приклади
+ запропонувати свій приклад у пісочниці
Кернінг — індивідуальні відстані між парами літер (AV, WA, To). З none пари розсуваються на «сирі» відстані — порівняй ширину однакових рядків.
HTML
<p class="on">Кернінг увімкнено: AVATAR WAVE Tor</p>
<p class="off">Кернінг вимкнено: AVATAR WAVE Tor</p>CSS
p {
font-size: 28px;
font-family: Georgia, serif;
}
.on { font-kerning: normal; }
.off { font-kerning: none; }Приклад використання
Коментарі
Коментарів ще немає — будьте першим!