क्या फ़ॉन्ट अंतर को ठीक करने के लिए मैक ओएस विशिष्ट सीएसएस बनाना संभव है?

Question

मैं एक डिजाइनर के साथ एक परियोजना पर काम कर रहा हूं और उन्होंने पृष्ठ के शीर्षक और विभिन्न तत्वों के लिए कुछ विशिष्ट फ़ॉन्ट का उपयोग करने पर जोर दिया। तो हम @ फ़ॉन्ट-फेस के साथ एम्बेड करने के लिए एक फ़ॉन्ट किट का उपयोग कर रहे हैं।

यह पीसी पर पूरी तरह से काम कर रहा है (Firefox, IE 7 और 8, क्रोम, सफारी) लेकिन मैक ओएस (सफारी और Firefox) पर फोंट खड़ी उसी तरह गठबंधन नहीं कर रहे हैं। वेब पर देखने के बाद, मुझे इसके लिए कोई समाधान नहीं मिला, "ब्राउज़र और प्लेटफ़ॉर्म के बीच हमेशा अंतर होता है, इसके साथ रहते हैं"।

मुझे पता है कि फोंट ठीक उसी भर प्लेटफार्मों गाया कभी नहीं कर रहे हैं, लेकिन इस बार यह कुछ नहीं है फॉन्ट की तरह अधिक बोल्ड या ऐसा ही कुछ लग रहा है। फ़ॉन्ट ऐसा लगता है कि यह बेसलाइन विंडोज और मैक ओएस एक्स के बीच पूरी तरह से अलग है। मैक ओएस पर, 16px के आकार पर फ़ॉन्ट पीसी पर 3px अधिक है।

तो मैं बैकअप समाधान की तलाश में हूं: क्या विशेष रूप से मैक ओएस उपयोगकर्ताओं के लिए सीएसएस बनाने का कोई तरीका है? मैं केवल सफारी को लक्षित नहीं करना चाहता क्योंकि सफारी पीसी ठीक है, और फ़ायरफ़ॉक्स मैक ठीक नहीं है।

या यदि आप आधारभूत अंतर यह है कि एक विशिष्ट सीएसएस फ़ाइल की आवश्यकता नहीं है तय करने के लिए एक समाधान है, मैं इसे सुनने के लिए खुशी होगी।

धन्यवाद!

Answer 1

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

Answer 2

मुझे डर है कि ब्राउज़र/ओएस स्नीफिंग आपका एकमात्र विकल्प है। सीएसएस को ओएस का कोई ज्ञान नहीं है और न ही मैंने कभी एक सीएसएस हैक के बारे में सुना है जो विशेष रूप से ओएसएक्स को लक्षित करता है।

यह मैं OSX का पता लगाने और दस्तावेज़ के मुख्य भाग OSX वर्ग जोड़ें ताकि आप विशेष रूप से OSX के लिए सीएसएस शैलियों ओवरराइड कर सकते हैं करने के लिए सबसे आसान तरीका है।

if(navigator.platform.match('Mac') !== null) { 
    document.body.setAttribute('class', 'OSX'); 
} 

Answer 3

एक आसान तरीका है। http://rafael.adm.br/css_browser_selector/

यह ब्राउज़र और ओएस का पता लगाता है और आप इसे करने के लिए विशिष्ट वर्गों को निर्दिष्ट करने की अनुमति देता है।

Answer 4

यदि आप करीबी से परिपूर्ण और दर्द रहित चाहते हैं, तो आपको ऑनलाइन फोंट या फोंट का उपयोग ऑनलाइन सेवा से करना होगा जैसे Google की फ्री फ़ॉन्ट लाइब्रेरी या फॉर-पे फ़ॉन्ट लाइब्रेरीज़ में से एक। इन फ़ॉन्ट्स को वेब पर काम करने के लिए डिज़ाइन और परीक्षण किया गया है।

प्रयोग और डाउनलोड करने और सही ढंग से प्रदर्शित करने के लिए प्रयास करने के लिए उपयोगकर्ता के ब्राउज़र के लिए फ़ॉन्ट सहित ठीक है, लेकिन सही नहीं होगा और दर्द रहित नहीं होगा। साथ ही, लाइसेंस प्रतिबंधों से बहुत सावधान रहें - सुनिश्चित करें कि आपके डिजाइनर का उपयोग करना चाहता है जो फ़ॉन्ट्स ग्राहक की वेबसाइट पर उपयोग के लिए उचित रूप से लाइसेंस प्राप्त हैं।

आप ब्राउज़र सूँघने क्या करना है और कई स्टाइलशीट की सेवा करते हैं, तो इस बिंदु पर मैं कहता हूँ कि आपके द्वारा डिजाइन टूट गया है और संशोधित किया जाना चाहिए। अपने डिजाइनर को https://fonts.google.com दिखाएं और देखें कि क्या उनमें से कोई भी पसंद करता है - वे सभी आधुनिक ब्राउज़रों में क्रॉस-प्लेटफ़ॉर्म काम करते हैं और कुछ बहुत ही धीमे होते हैं। संपादित करें: ओह, और वे लाइसेंसिंग की चिंता के बिना उपयोग करने के लिए स्वतंत्र हैं।