Bir Web Sitesine Özel Font Desteği Eklemek

Client'ın pc veya telefonunda olmayan fontları web sitesinizde kullanabilirsiniz. Örneğin XFont adında bir font eklemek için aşağıdaki gibi bir css kullanabilirsiniz :

@font-face {
    font-family: "XFont";
    src: url('fonts/XFontBol.ttf');
    src: url('fonts/XFontBolIta.ttf');
    src: url('fonts/XFontDem.ttf');
    src: url('fonts/XFontDemIta.ttf');
    src: url('fonts/XFontMed.ttf');
    src: url('fonts/XFontMedIta.ttf');
    src: url('fonts/XFontReg.ttf');
}

ttf dosyaları fonts klasörü içinde olduğu varsayıyoruz. Klasör yapısı aşağıdaki gibidir :

index.html (style'ın bulunduğu sayfa)
fonts/XFontBol.ttf
fonts/XFontBolIta.ttf
...
...

Yukarıdaki gibi tanımlama yaptıktan sonra XFont adındaki fontu Arial, Times gibi artık kullanabiliriz