В font-variantимота ви позволява да промените целевото текста малки букви. Това свойство е разширено в CSS3.
p:first-line ( font-variant: small-caps; /* default is `normal` */ )Преди CSS3 това свойство приемаше една от двете възможни стойности: 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стенографска декларация.
Нови допълнения в CSS3
В CSS3, font-variantсе превръща в стенограмите и може да приеме повече от една стойност, в това число all-small-caps, petite-caps, all-petite-caps, titling-caps, и unicase, между другото.
Поддръжка на браузър
| Chrome | Сафари | Firefox | Опера | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Върши работа | Върши работа | Върши работа | Върши работа | Върши работа | Върши работа | Върши работа |
Новите стойности, добавени в CSS3, нямат поддръжка от браузъра, така че таблицата по-горе представлява поддръжка за стойност от small-caps.
В IE6 / 7 настройката font-variant: small-capsще накара всеки текст, зададен text-transform: uppercaseили text-transform: lowercaseда изглежда като text-transform: none.