Фонт-варијанта - ЦСС-трикови

Anonim

font-variantИмовина вам омогућава да промените циљани текст малим словима. Ово својство је проширено у ЦСС3.

p:first-line ( font-variant: small-caps; /* default is `normal` */ )

Пре ЦСС3, ово својство је прихватало једну од две могуће вредности: normal(како се текст подразумевано приказује) и small-caps.

Вредност small-capsће приказати текст великим словима која су мања од обичних великих слова. Ово не замењује горње поставке у садржају унутар ознака. На пример:

Погледајте ову оловку!

У горњој демонстрацији постављена су оба пасуса font-variant: small-caps. Први пасус има само велико почетно слово у ознаци, па се чини очекивано (велико почетно слово, остатак малим словима).

Други ред је написан великим словима у ознаци, што поништава small-capsвредност, постављајући све великим словима.

Узимајући ово даље, ако су ови пасуси постављени на font-variant: small-capsи text-transform: lowercase, тада ће се појавити у свим малим капицама. Слично томе, ако су ови пасуси постављени на font-variant: small-capsи text-transform: uppercase, тада ће се појавити у свим редовним великим словима.

font-variantможе се укључити као део fontстенографске декларације.

Нови додаци у ЦСС3

У ЦСС3, font-variantпостаје скраћено и може да прихвати више вредности, укључујући all-small-caps, petite-caps, all-petite-caps, titling-caps, и unicase, између осталог.

Подршка прегледача

Хром Сафари Фирефок Опера ИЕ Андроид иОС
Извођење радова Извођење радова Извођење радова Извођење радова Извођење радова Извођење радова Извођење радова

Нове вредности додате у ЦСС3 немају подршку прегледача, па горња табела представља подршку за вредност од small-caps.

У ИЕ6 / 7, подешавање font-variant: small-capsће проузроковати да било који текст постављен на text-transform: uppercaseили text-transform: lowercaseизгледа тако text-transform: none.