إضافة خط بصيغة ttf

أولا أنصحك باستخدام الخط بنسخة woff و woff2

دعم المتصفحات للأول جيد جدا، والدعم للثانية ضعيف ولكن لا مشكلة

نسخة woff أقل بحوالي 50% من حجم ttf ونسخة woff2 ممكن تصل إلى 80% أقل من حجم ttf

لتحول الخط من هنا

2

حسنا، الآن لنجيب على سؤالك

الكود كالتالي

@font-face {
    font-family: 'Font name';
    src: url('font-name.ttf') format('truetype'),
    url('font-name.woff') format('woff'),
    url('font-name.woff2') format('woff2'),;
    font-weight: 700; //bold
    font-style: normal;
}

ثم تستعمله لاحقا عبر font-family