اضافه خط من قوقل فونتس

بعد أن تقوم بتحميل الخطوط و تضيفها الى ملفات المشروع عليك أن تقوم بإضافة الكود الاتي:

@font-face {
  font-family: myFontFamily1;//هنا تقوم بكتابة اسم عائلة الخط
  src: url(sansation_light.woff);//هنا تقوم بكتابة مسار تواجد الخط
}


@font-face {
  font-family: myFontFamily2;//هنا تقوم بكتابة اسم عائلة الخط
  src: url(sansation_light.woff);//هنا تقوم بكتابة مسار تواجد الخط
}

h1:{
  font-family:myFontFamily1;
}

p:{
  font-family:myFontFamily2;
}

حيث يتعين عليك اضافة font-face لكل خط على حده.

لقد جربت هذه الطريقه لكن @font-face الثانيه قامت بالغاء الاولى 

بتاريخ 12 ساعات قال خالد مجذوب:

لقد جربت هذه الطريقه لكن @font-face الثانيه قامت بالغاء الاولى 

ارجو منك ارفاق ملف المشروع الخاص بك.

يمكنك أن تستخدم أي خط من Google Fonts بدون أن تقوم بتحميلها من خلال الضغط على الهط الذي تريده ومن ثم الضغط على زر Select this style أمام سُمك الخط الذي تريده، ستظهر لك نافذة جانبية بها عنصر link وطريقة إستخدام الخط في CSS، قم بإضافة عنصر link في عنصر head في صفحة HTML وسيكون بإمكانك أن تستخدم الهط كما هو موضح في الصورة التالية:

كما يمكنك إستهدام طريقة import من خلال CSS، فقط إضغط على خيار @import وضع الكود أعلى ملف CSS (بدون وسم style بالطبع)

بالتوفيق.