fontFamily özelliği, element içinde kullanılacak yazı tipini ve alternatif yazı tiplerini yüksek öncelikten düşük önceliğe doğru belirlenmesini sağlar. Alternatif fontlar birbirlerinden virgül ile ayrılarak belirtilir.
DOM Sözdizimi
element.style.fontFamily = "yazitipi [, yazitipi ]"
CSS Sözdizimi
font-family: yazitipi [, yazitipi ]
| yazitipi | İlk değerin yüksek önceliğe sahip olduğu bir kereden fazla tekrarlanabilen bu değer, font ailesini veya genel font ailesini belirler. |
Font ailesi olarak tırnak işaretleri arasında tarayıcının desteklediği herhangi bir yazı fontu adı belirtilebilir. Genel font olarak ise, serif, sans-serif, cursive, fantasy, ve monospace değerlerinden biri tırnak işaretleri arasına almadan belirtilebilir. Genel fontlar sistemlerde gömülü olan yazı tipleridir.
Kodların çalışacağı sistemde kurulu olan fontlar bilinemeyeceği için font-family tanımlanırken son değer genel fontlardan biri olmalıdır.
Aşağıdaki örnek, CSS font-family özelliği ile bir kaç farklı fonr ailesi ve genel font tanımlamasını göstermektedir.
<style type="text/css">
p.font1 { font-family: "Times New Roman";}
p.font2 { font-family: "Courier New"; }
p.font3 { font-family: sans-serif; }
p.font4 { font-family: fantasy; }
p.font5 { font-family: "Blackadder ITC"; }
</style>
<p class="font1">Bu paragrafta "<b>Times New Roman</b>" yazı tipi ailesi kullanılmıştır.</p>
<p class="font2">Bu paragrafta "<b>Courier New</b>" yazı tipi ailesi kullanılmıştır.</p>
<p class="font3">Bu paragrafta "<b>sans-serif</b>" genel yazı tipi kullanılmıştır.</p>
<p class="font4">Bu paragrafta "<b>fantasy</b>" genel yazı tipi kullanılmıştır.</p>
<p class="font5">Bu paragrafta "<b>Blackadder ITC</b>" yazı tipi ailesi kullanılmıştır.</p>
Canlı Sonuç
Bu paragrafta "Times New Roman" yazı tipi ailesi kullanılmıştır.
Bu paragrafta "Courier New" yazı tipi ailesi kullanılmıştır.
Bu paragrafta sans-serif genel yazı tipi kullanılmıştır.
Bu paragrafta fantasy genel yazı tipi kullanılmıştır.
Bu paragrafta "Blackadder ITC" yazı tipi ailesi kullanılmıştır.