सीएसएस Google फ़ॉन्ट्स - आईई

Question

में इटालिक्स फैला रहा है मेरे पास Google फ़ॉन्ट्स के बारे में एक प्रश्न है। मैं Google Fonts से फ़ॉन्ट "लेटो" का उपयोग कर रहा हूं और ऐसा लगता है कि यह फ़ायरफ़ॉक्स, क्रोम, आईई 9 में सही काम कर रहा है लेकिन आईई 7 और 8 में इटालिक संस्करण वास्तविक दिखता है।

मैं कुछ भी भी पागल बस

font-style:italic; font-weight:700; 

का उपयोग नहीं कर रहा हूँ और का उपयोग कर फ़ॉन्ट सहित:

<link href='http://fonts.googleapis.com/css?family=Lato:400,700,700italic,900italic' rel='stylesheet' type='text/css'> 

इस गूगल फ़ॉन्ट्स के साथ एक ज्ञात समस्या है या यह है कुछ मैं गलत कर रहा हूँ?

धन्यवाद!

Answer 1

किसी भी कारण से (शायद कोई भी क्यों मदद कर सकता है), Google ने आईई उपयोगकर्ताओं को नियमित रूप से किसी अन्य फ़ॉन्ट प्रकार की सेवा न करने का निर्णय लिया है। यह व्यवहार उपयोगकर्ता-एजेंट द्वारा नियंत्रित किया जाता है - यदि आप फ़ायरफ़ॉक्स बनाम आईई में सीएसएस यूआरएल (अपने मामले http://fonts.googleapis.com/css?family=Lato:400,700,700italic,900italic में) लोड करते हैं तो आप देखेंगे कि केवल एक @font-face ब्लॉक IE पर वापस आ गया है।

तो, इसके आसपास जाने का सबसे आसान तरीका फ़ायरफ़ॉक्स में उस यूआरएल को लोड करना है और सीएसएस को अपनी सीएसएस फ़ाइल में कॉपी/पेस्ट करना है, बजाय Google से सीधे सेवा करना। अब आईई के पास सभी फ़ॉन्ट वेरिएंट तक पहुंच होगी ... लेकिन तकनीकी रूप से आप सीएसएस फ़ाइल और अंतर्निहित फ़ॉन्ट फाइलों के बीच लिंक तोड़ रहे हैं, जो कभी नहीं बदलना चाहिए, लेकिन यह पूरी तरह से Google के विवेकानुसार है।

दुर्भाग्यपूर्ण बात यह है कि (शायद उनके तर्क का हिस्सा), आईई फ़ॉन्ट को विशेष रूप से तब भी प्रस्तुत नहीं करता है। मेरे परीक्षण में, सेमिबॉल्ड वजन उस से अधिक साहसी दिखाता है और इटालिक्स थोड़ा अलग दूर लगता है। यह कम से कम अतिरिक्त रूपों के बिना अशुद्ध-इटालिक ओब्लिक फ़ॉन्ट आईई प्रस्तुत करता है, यह अभी भी अधिक सुखद लग रहा है।

संपादित: कुछ और अनुसंधान के बाद, मैं एक महान पेज on Typekit जो मुद्दा विस्तृत रूप से दस्तावेजों पाया है। असल में, जब कस्टम फ़ॉन्ट परिवारों की बात आती है तो आईई बेहद सीमित है - आईई के साथ सफलता प्राप्त करने में एकमात्र तरीका यह है कि आईई में अलग-अलग फ़ॉन्ट परिवारों के रूप में अपने रूपों को परिभाषित करना है, और फिर उन विभिन्न फ़ॉन्ट्स का उपयोग करना है आप अन्य ब्राउज़रों में font-weight और font-style का उपयोग करेंगे। यह आपको सार्वभौमिक संगतता देना चाहिए।

संपादित 2: यह पता चला है कि आईई फोंट के लिए यूआरएल अन्य ब्राउज़रों के लिए अलग हैं (आईई woff के बजाय ईट प्रारूप का उपयोग करता है)।

• फ़ायरफ़ॉक्स/क्रोम/आदि में खोलें http://fonts.googleapis.com/css?family=Lato:400,700,700italic,900italic और एक नई फ़ाइल में सीएसएस कॉपी, या अपने यानी-केवल स्टाइलशीट में: कैसे अपने फ़ॉन्ट के लिए यह काम कर पाने के लिए एक संपूर्ण प्रक्रिया इस प्रकार होगा।
• सभी 'स्थानीय' और 'प्रारूप' src परिभाषाओं के माध्यम से जाएं और आपको केवल 'यूआरएल' भागों के साथ छोड़ दें।
• आपके फ़ॉन्ट स्टाइलशीट यूआरएल में निर्दिष्ट प्रत्येक संस्करण के लिए (आपके उदाहरण में, ये 400, 700, 700italic और 900italic होंगे), के साथ आईई में फ़ॉन्ट स्टाइलशीट लोड करें, यह संस्करण केवल है और परिणामी सीएसएस को टेक्स्ट एडिटर में खोलें । उदाहरण के लिए, सुपरबॉल्ड इटैलिक संस्करण प्राप्त करने के लिए http://fonts.googleapis.com/css?family=Lato:900italic लोड करें।
• अपनी नई स्टाइलशीट में मिलान करने वाला संस्करण ढूंढें (font-style और font-weight गुणों का मिलान होना चाहिए) और IE के लिए ईओटी के साथ woff src url को प्रतिस्थापित करें। फ़ॉन्ट को एक अलग परिवार भी दें - मैं टाइपकिट डू जैसी शैली और वजन के साथ प्रत्यय की अनुशंसा करता हूं, ताकि ओपन सेन्सओपन सेन्स i9 और इसी तरह से हो।
• यह सभी शेष प्रकारों के लिए ऐसा करें।
• सशर्त रूप से उस नए स्टाइलशीट को शामिल करें जिसमें आप पहले से ही अन्य ब्राउज़रों के लिए उपयोग कर रहे हैं।
• आप कहीं भी अपने सीएसएस में font-style या font-weight का इस्तेमाल किया है, एक font-family रूप में जोड़ दें, नए परिवार के नाम और सही परिवार के नाम को संदर्भित जैसे दूसरे ब्राउज़र द्वारा देखा। उदाहरण के लिए: font-family: 'Open Sans i9', 'Open Sans'; font-weight: 900; font-style: italic;। यह आईई संगतता के लिए फ़ॉन्ट परिवार का नाम और अन्य ब्राउज़रों में बेस परिवार + वेरिएंट का उपयोग करेगा।

Answer 2

दो नमूने एक ही इटैलिक फ़ॉन्ट प्रदर्शित नहीं कर रहे हैं। मैं अनुमान लगा रहा हूं कि आईई 7/8 एक कृत्रिम रूप से इटालिसिक है। मैं आगे अनुमान लगा रहा हूं कि ऐसा इसलिए है क्योंकि फ़ॉन्ट वजन वास्तव में फ़ॉन्ट फ़ाइल में से मेल नहीं खाता है; इसके बजाय 500 के वजन का उपयोग करने का प्रयास करें।

Answer 3

यह एक पुराने सवाल है, लेकिन मैं एक घंटे के लिए googling गया था इस अशुद्ध bolds और IE8 में अशुद्ध इटैलिक के लिए एक आसान तरीके को खोजने के लिए। यहां मेरे लिए क्या काम किया गया है: एक बार में सभी फोंट लोड करने के बजाय मैं उन्हें एक-एक करके लोड करता हूं। मैं css फ़ाइल में @import विधि पसंद करता हूं, इसलिए यह इस प्रकार है:

@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic); 
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic); 
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400); 
@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);