2012-04-09 9 views
6

इस पन्ने पर: मुख्य पाठ में http://www.anasiamusic.com/bio.html कि <div> के लिए font-family संपत्ति के रूप में निर्दिष्ट किया जाता है ("एना सिया के डीजे टोकरा एक टिकर है ..."):यह सीएसएस फ़ॉन्ट-परिवार "इकोनॉमिका" को सही तरीके से प्रदर्शित कैसे कर रहा है?

font-family: 'Economica', sans-serif 

मैं सोच रहा था कि यह कैसे काम करता है - यहां तक ​​कि इंटरनेट एक्सप्लोरर में, आई 7 व्यूइंग मोड पर, यह अभी भी अनुमानित रूप से प्रदर्शित होता है। मैं बॉडी कॉपी के लिए जॉर्जिया, वर्दाना और अन्य जैसे वेब-सुरक्षित फ़ॉन्ट्स पर चिपक रहा था, विशेष रूप से और मैं इस धारणा के तहत था कि इस तरह कुछ हासिल करने और इसे क्रॉस-प्लेटफॉर्म संगत बनाने के लिए, किसी को @font-face का उपयोग करना पड़ा।

जाहिर है, मैं गलत हूं, क्या कोई वेब व्याख्यान पर कुछ अच्छे संसाधनों को समझा सकता है और शायद आगे बता सकता है जो आगे बढ़ सकता है?

ध्यान दें कि मेरे पास मेरे कंप्यूटर (विंडोज 7) पर इकोनॉमिका स्थापित नहीं है।

उत्तर

8

इकोनॉमिका Google Web Fonts (link to font specimen) द्वारा आपूर्ति की जाती है।

यह इस <link> टैग है, जो आपको पेज सिर में पा सकते हैं के माध्यम से भरी हुई है:

<link href='http://fonts.googleapis.com/css?family=Economica:700' rel='stylesheet' type='text/css'> 

और फिर ब्राउज़रों कि @font-face CSS नियम, इस तरह है कि वे इसे पृष्ठ के भीतर प्रदान कर सकते हैं समर्थन से एम्बेडेड। आप CSS3 spec में @font-face के बारे में अधिक पढ़ सकते हैं।

Google वेब फ़ॉन्ट्स फ़ॉन्ट को एम्बेड करने के लिए ब्राउज़र को बताने के लिए उचित प्रारूप के साथ उस नियम का उपयोग करता है। ब्राउज़र फिर फ़ॉन्ट डाउनलोड करते हैं और इसे प्रस्तुत करने का प्रयास करते हैं, यदि वे उस प्रारूप में हैं जो वे समझते हैं, जो विफल हो जाते हैं, जिससे वे स्टैक में जो कुछ भी आता है, उसमें वापस आ जाएंगे (इस मामले में, सामान्य परिवार sans-serif)। वास्तव में, यह सब वहाँ है।

फ़ॉन्ट प्रारूप है कि अंततः डाउनलोड होने वाले ब्राउज़र पर निर्भर है: आधुनिक ब्राउज़रों केवल WOFF प्रारूप डाउनलोड करने के लिए है, जबकि IE7 की तरह पुराने ब्राउज़र आदेश के रूप में फ़ॉन्ट एम्बेड करने के लिए में एक अलग ईओटी (! IE4 के बाद से समर्थित) कहा जाता प्रारूप प्राप्त की जरूरत है कुंआ। अन्य ब्राउज़रों के पिछले संस्करण टीटीएफ, ओटीएफ और यहां तक ​​कि एसवीजी जैसे अन्य प्रारूप भी चुन सकते हैं। आप this one जैसे बुलेटप्रूफ @font-face सिंटैक्स के बारे में आलेखों में विभिन्न प्रारूपों और उनके उपयोगों के बारे में अधिक पढ़ सकते हैं।

+0

बहुत गहराई से, धन्यवाद! – ZenLikeThat

0

मुझे एक अलग फ़ॉन्ट के साथ एक ही समस्या थी। मैंने जो किया वह इस साइट का उपयोग here था और निर्देशों का पालन किया। बाहर निकलता है, फ़ॉन्ट जैज़ सभी फ़ॉन्ट प्रकारों को वेब सुरक्षित होने में परिवर्तित करता है। यह भी उपयोग करने के लिए काफी सरल है; बस दो जेएस फाइलें।

आशा है कि मदद करता है!

संबंधित मुद्दे

 संबंधित मुद्दे