CSS फाइलों का लिंक
आप अनिवार्य रूप से Google.com पर CSS फाइलों में सीधे हॉटलाइन करते हैं। URL मापदंडों के माध्यम से, आप विशिष्टता चाहते हैं कि आप कौन से फ़ॉन्ट चाहते हैं, और उन फोंट की कौन सी विविधताएँ हैं।
… सीएसएस
अपने सीएसएस में आप इन नए फोंट को किसी भी तत्व पर नाम के साथ निर्दिष्ट कर सकते हैं जिसे आप उनका उपयोग करना चाहते हैं।
body ( font-family: 'Tangerine', 'Inconsolata', 'Droid Sans', serif; font-size: 48px; )FontLoader
आप CSS से लिंक करने के बजाय FontLoader JavaScript का उपयोग कर सकते हैं। इसके फायदे हैं, जैसे फ्लैश ऑफ अनस्टील्ड टेक्स्ट (FOUT) को नियंत्रित करना, और नुकसान भी, इस तथ्य की तरह कि फॉन्ट जावास्क्रिप्ट बंद के साथ उपयोगकर्ताओं के लिए लोड नहीं होगा।
WebFont.load(( google: ( families: ('Cantarell') ) )); .wf-loading h1 ( visibility: hidden; ) .wf-active h1, .wf-inactive h1 ( visibility: visible; font-family: 'Cantarell'; ) वे वर्ग नाम, जैसे तत्व पर .wf-loadingलागू होते हैं । इसलिए ध्यान दें कि जब फोंट "लोड हो रहा है", तो आप पाठ को छिपाने के लिए उस वर्ग के नाम का उपयोग कर सकते हैं। फिर जब वे दिखाए जाते हैं, तो उन्हें फिर से दिखाई दें। इस तरह से FOUT नियंत्रित किया जाता है।