unicode-rangeИмовина у ЦСС-у се користе од стране @font-faceда се дефинише ликове које подржава фонтова лицу.
@font-face ( font-family: 'MyWebFont'; /* Define the custom font name */ src: url('myfont.woff2') format('woff2'), url('myfont.woff') format('woff'); /* Define where the font can be downloaded */ unicode-range: U+00-FF; /* Define the available characters */ )Другим речима, @font-faceпозваће се на својство и утврдити да ли треба да преузме и користи фонт на основу тога да ли се знакови или опсег знакова подударају са онима у ХТМЛ документу.
Лице фонта: Хеј ХТМЛ, да ли се било који од следећих знакова подудара са оним што је на страници?
ХТМЛ: Да, гомила њих то зна.
Фонт-Фаце: Супер, ево датотеке фонта коју бисте требали преузети да бисте приказали те знакове.
Важна семантичка разлика коју бисмо овде требали позвати је та да unicode-rangeодређује за које знакове фонт може да се користи, а не за то које знакове је фонт доступан. Другим речима, ако прогласимо да unicode-rangeсе @font-faceа и знакови учитани у ХТМЛ документ подударају са тим опсегом, фонт ће се преузети и ставити у употребу.
Можете да замислите предности перформанси које се отварају са овом особином. На пример, прилагођени фонт можемо учитати само ако садржи одређене знакове, уместо да увек учитава фонт у свим ситуацијама.
Постоји чак и начин да се комбинују два @font-faceсета на истој font-faceдекларацији имовине, захваљујући згодном трику који је делио Јаке Арцхибалд. Идеја је да један @font-faceскуп надјача други на основу подударних unicode-range, оптимизирајућих перформанси или једноставно побољшавајући типографију на страници.
Вредности
Било који код или опсег Уницоде знакова је прихватљива unicode-rangeвредност. Приметићете да уницоде тачкама претходи U+и до шест знакова који чине код карактера. Тачке или опсези који се не придржавају овог формата сматрају се неважећим и довешће до занемаривања својства.
- Један знак (нпр.
U+26) - Распон знакова (нпр.
U+0025-00FF) - Опсег џокер знакова (нпр.
U+4??)
Вилдцард Ранге је зезнут. Сваки ?представља џокер где се било која вредност подудара. Помислили бисте да то значи да можете заменити целу ствар нечим овако:
@font-face ( font-family: 'MyWebFont'; src: url('myfont.woff2') format('woff2'), url('myfont.woff') format('woff'); unicode-range: U+??????; /* This does not work! */ )Међутим, ово неће успети. Разлог је тај што вођење са ?подразумева код карактера који води са 0, што значи да се може користити до пет знакова питања, упркос томе што уницодес прихватају до шест укупних знакова.
@font-face ( font-family: 'MyWebFont'; src: url('myfont.woff2') format('woff2'), url('myfont.woff') format('woff'); unicode-range: U+?????; /* This works and is equivalent to U+0????? */ )Постоји гомила уницоде опција. Основни латиница ( 0020-007F) је вероватно најчешћи опсег за енглеске веб локације, али уницоде-табле.цом пружа свеобухватан списак свих расположивих опсега са кодовима за одређене знакове.
Подршка прегледача
Подаци о подршци за прегледач су од компаније Цаниусе, која садржи више детаља. Број указује на то да прегледач подржава функцију у тој верзији и новијој.
Десктоп
| Хром | Фирефок | ИЕ | Ивица | Сафари |
|---|---|---|---|---|
| 36 | 44 | 11 | 17 | 10 |
Мобиле / Таблет
| Андроид Цхроме | Андроид Фирефок | Андроид | иОС Сафари |
|---|---|---|---|
| 88 | 85 | 81 | 10.0-10.2 |
Додатна литература
- Спецификација нивоа 3 модула фонтова ЦСС
- Табела Уницоде: Ресурс који упућује на скупове и кодове Уницоде знакова.
- Коришћење @ фонт-фаце: ЦСС-Трицкс пост који описује како се
@font-faceради са различитим техникама и примерима рада. - Каква је ствар са декларисањем својстава фонта на @ фонт-фаце ?: ЦСС-Трицкс пост који је повезан колико се подударајуће вредности у својствима фонта могу користити да би се утврдило да ли прилагођени фонт преузима и користи прегледач.