font-variantMülkiyet küçük büyük harfler hedefleyen metni değiştirmek için izin verir. Bu özellik CSS3'te genişletilmiştir.
p:first-line ( font-variant: small-caps; /* default is `normal` */ )CSS3'ten önce, bu özellik iki olası değerden birini kabul etti: normal(metin varsayılan olarak nasıl işlenir) ve small-caps.
Bir değeri small-caps, metni normal büyük harflerden daha küçük olan büyük harflerle işler. Bu, biçimlendirmenin içindeki içerikteki büyük harf kümesini geçersiz kılmaz. Örneğin:
Yukarıdaki demoda, her iki paragraf da olarak ayarlanmıştır font-variant: small-caps. İlk paragraf, biçimlendirmede yalnızca ilk büyük harf içerir, bu nedenle beklendiği gibi görünür (ilk harf büyük, kalan küçük büyük harf).
İkinci satır, işaretlemede tamamen büyük harfle yazılır ve bu, small-capsdeğeri geçersiz kılar ve her şeyi normal olarak büyük harfle ayarlar.
Bu paragraflar olarak belirlendiyse, ayrıca bu alarak font-variant: small-capsve text-transform: lowercasedaha sonra hepsi küçük harflerle görünecektir. Bu paragraflar ayarlanır Benzer şekilde, font-variant: small-capsve text-transform: uppercasesonra hepsi düzenli büyük harf görünecektir.
font-variantfontsteno bildirinin bir parçası olarak eklenebilir .
CSS3'te Yeni Eklemeler
CSS3 olarak, font-variantbir kısaltmadır olur ve dahil çoklu değerleri kabul edebilir all-small-caps, petite-caps, all-petite-caps, titling-caps, ve unicasediğerleri.
Tarayıcı Desteği
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| İşler | İşler | İşler | İşler | İşler | İşler | İşler |
CSS3'e eklenen yeni değerlerin tarayıcı desteği yoktur, bu nedenle yukarıdaki tablo bir değeri için desteği temsil eder small-caps.
IE6 / 7'de, ayar font-variant: small-caps, herhangi bir metnin ayarlanmasına text-transform: uppercaseveya text-transform: lowercasegibi görünmesine neden olacaktır text-transform: none.