font-variant-numericИмовина у ЦСС подржава формат фонт ОпенТипе навођењем који бројчане Глипхс да користе на часу, укључујући и варијације за фракције, редним маркера и стила варијација између осталих.
Мали контекст
О бројевима обично размишљамо као о статичном глифу. Штампа се и то је тако. Међутим, бројеви су много више попут слова абецеде у смислу да могу имати варијанте које, у зависности од контекста, вреде модификовања стила. Говоримо о стварима попут разломака (нпр. 1/4), редних бројева (нпр. 1.), па чак и еквивалента великих и малих бројева. Међутим, за разлику од слова, ове варијације не мењају значење садржаја, мада дају додатни контекст или утичу на читљивост.
Ову особину представља проблем у томе што је дизајниран за рад са фонтовима који имају ОпенТипе, нови, али брзо развијајући формат фонта који пружа шири скуп глифова који се могу циљати за употребу у различитим контекстима. Често можете чути ОпенТипе који се назива променљивим фонтовима, а то је зато што садржи већи број знакова који их чине флексибилнијим за разне намене. Варијације за све ствари!
Проблем је у томе што је доступност фонтова који могу у потпуности искористити font-variantи font-variant-numericограничена. Све је већи број фонтова компатибилних са ОпенТипеом, али постоји много мања подскупа опција које користе све функције које font-variant-numericнуде, а оне су често премиум и скупе. Рицхард Бутлер то лепо сумира:
На располагању су нам бројеви „великих слова“ који се називају бројеви који означавају облоге или наслове, и бројеви „малих слова“ који се називају старим или текстуалним бројевима. ... Такође је случај да велика већина фонтова није ни модерна ни професионална, ако модерни значи ОпенТипе- омогућена и професионална средства дизајнирана са оба скупа бројева.
Највеће питање којим се обично бавимо када су у питању ЦСС својства је подршка за прегледаче, али ово својство и сва остала повезана са font-variantњима такође су на милост и немилост дизајнера фонтова да пруже потпуну подршку столу.
То је грозно, али почињемо да виђамо више „модерних“ и „професионалних“ фонтова, чак и у време овог писања. Адобе ТипеКит најавио је да ради на подршци ОпенТипе функција, а шушкало се и да је на располагању и Гоогле Фонтс сада када их Цхроме 62 подржава.
Основна употреба
Ово је најосновније коришћење имовине:
.fraction ( font-variant-numeric: diagonal-fractions; )Старији прегледачи то неће препознати, али прихватају font-feature-settingsкоји откључавају исте функције са различитим вредностима. Два својства можемо упарити за дубљу подршку:
.fraction ( font-feature-settings: frac; font-variant-numeric: diagonal-fractions; )Или ово можемо прилагодити тако да њушка подршку за прегледаче користећи @supportsтако да се ново својство служи само за подршку прегледачима:
.fraction ( font-feature-settings: frac; ) @supports (font-variant-numeric: diagonal-fractions) ( .fraction ( font-feature-settings: frac; font-variant-numeric: diagonal-fractions; ) )Вредности
font-variant-numericИмовине прихвата следеће вредности. Одговарајућа font-feature-settingsвредност је наведена као референца.
Опште вредности
| Вредност | Опис | Подешавање карактеристика |
|---|---|---|
normal | Ниједна од функција наведених у наставку није омогућена. | Н / А |
ordinal | Примењује слова за представљање нумеричког поретка, обично у облику натписа. | ordn |
slashed-zero | Приказује алтернативни облик нуле са дијагоналном линијом која пролази кроз њу. | zero |
Нумеричке вредности слика
| Вредност | Опис | Подешавање карактеристика |
|---|---|---|
lining-nums | Линије се вертикално броје тако да се придржавају исте висине поравнају се на истој равни. | lnum |
oldstyle-nums | Омогућава алтернативно вертикално поравнање где бројеви нису увек равномерно приказани на истој основној линији. | onum |
Нумеричке вредности разломка
| Вредност | Опис | Подешавање карактеристика |
|---|---|---|
diagonal-fractions | Приказује разломке у мањем формату где су бројник (горњи број) и називник (доњи број) подељени дијагоналном косом цртом. | frac |
stacked-fractions | Приказује разломке у мањем формату где су бројилац и називник сложени један на други и подељени водоравном линијом. | afrc |
Нумеричке вредности размака
| Вредност | Опис | Подешавање карактеристика |
|---|---|---|
proportional-nums | Омогућава бројевима да заузимају сопствену количину простора који по ширини није нужно једнак осталим бројевима. | pnum |
tabular-nums | Приказује бројеве са једнаким величинама, пропорционалним и размаком за чисто форматирање у контексту табеларних података. | tnum |
Спецификација укључује посебну напомену о употреби ordinalјер подсећа на надређени supелемент, али је другачије означена.
За натписе:
sup ( font-variant-position: super; )Two squared is 22За редне маркере:
.ordinal ( font-variant-numeric: ordinal; )1stПодршка прегледача
font-variant-numericИмовина је тренутно део је ЦСС фонтови модул Левел 3 спецификацији, која је у кандидата препоруци статусу у време писања овог текста, што значи да може променити у било ком тренутку.
Десктоп
| Хром | Ивица | Фирефок | ИЕ | Опера | Сафари |
|---|---|---|---|---|---|
| 52 | Не | 34 | Не | 39 | 9.1 |
Фирефок 24-34 (ексклузивно) подржава својство иза layout.css.font-features.enabledпреференције када је постављено на true.
Мобиле
| Андроид претраживач | Цхроме Андроид | Ивица | Фирефок | ИЕ | Опера Андроид | иОС Сафари |
|---|---|---|---|---|---|---|
| 52 | 52 | Не | 34 | Не | 39 | да |