2012-01-21 12 views
10

हाय में @ फॉन्ट-फेस की भयानक प्रतिपादन,क्रोम

मैं वहाँ एक रास्ता किसी भी तरह फोंट कि @font-face बेहतर से लोड किए गए हैं रेंडर करने के लिए Chrome (शामिल सफारी और ओपेरा) के लिए मजबूर करने अगर सोच रहा हूँ? मुझे यकीन नहीं है कि यह केवल दो फ़ॉन्ट हैं, लेकिन मुझे ईमानदारी से संदेह है।

Screenshot

शीर्ष स्नैपशॉट फ़ायरफ़ॉक्स 8. में पाठ का प्रतिपादन क्रोम से नीचे से एक है (16) है। अब, यह को के रूप में परेशान नहीं करेगा अगर यह आईई में भी बहुत उत्साहजनक हो रहा था - लेकिन आईई में यह काफी आश्चर्यजनक रूप से प्रस्तुत करता है (एफएफ के समान)। text-shadow लागू करने

  1. की कोशिश की:

    तो, मैं कुछ चीजें कोशिश की थी। यह थोड़ा बेहतर लग रहा है, लेकिन अभी भी बहुत भयानक है।

  2. मैंने -webkit-font-smoothing: antialiased का उपयोग करने का प्रयास किया, लेकिन ऐसा कोई प्रभाव नहीं प्रतीत होता।

अब, मैं एक कष्टप्रद पूर्णतावादी होने से रोक सकता हूं और लोगो के लिए बस एक छवि का उपयोग कर सकता हूं (चूंकि छोटा पाठ बुरी तरह से प्रस्तुत नहीं करता है, लेकिन फिर भी बुरा है, आपको दिमाग है) और इसके साथ किया जाना चाहिए।

मुझे वास्तव में वह समाधान पसंद नहीं है, लेकिन अगर कोई दूसरा नहीं है तो मैं इसे स्वीकार करूंगा।

धन्यवाद!

+0

क्या आप कुछ कोड या डेमो लिंक पोस्ट कर सकते हैं ताकि हम इसके साथ खेल सकें? – ThinkingStiff

+0

आप [cufon] (http://cufon.shoqolate.com/generate/) – neworld

+0

@neworld को अपने दिमाग को पार कर सकते हैं, लेकिन मेरे पास छवियों द्वारा प्रतिस्थापित टेक्स्ट नहीं होगा (जिनकी प्रतिलिपि नहीं बनाई जा सकती पाठ के रूप में, उस पर)। – omninonsense

उत्तर

2

मैं ओएस एक्स पर लगभग सटीक विपरीत देख रहा हूं। क्रोम, सफारी ठीक है और फ़ायरफ़ॉक्स सही प्रदर्शित नहीं कर रहा है।

क्रोम 18.0.1003.1 देव:

enter image description here

सफारी 5.1.2 (7534.52.7):

enter image description here

फ़ायरफ़ॉक्स 9.0.1:

enter image description here

ओपेरा 11.60 बिल्ड 1185:

enter image description here

इंटरनेट एक्सप्लोरर 9.0.8112 (समानताएं वी एम के तहत):

enter image description here

यह विंडोज 7 की तरह लग रहा @font-face समस्याओं काफी आम हैं, और वहाँ एक हैं सामान्य रूप से असंगतताएं:

+0

यह क्या जादू है ?! क्या? हे भगवान। मैं शापित हूँ। डी: तुमने ऐसा कैसे किया ?? खैर, मैं विंडोज 7 पर हूं (यह देखने के लिए क्रोम देव चैनल पर स्विच करेगा कि मुझे एक ही परिणाम मिलेंगे)। – omninonsense

+0

@withadot। मैं ओएस एक्स पर हूं। इसके अलावा, एफएफ एक 100px से ऊपर एक अच्छा आकार दिखता है। क्रोम 16 के साथ मेरी विनक्सप मशीन पर – ThinkingStiff

+0

यह इस उत्तर में क्रोम 18 की छवि पर करता है जैसे –

4

https://stackoverflow.com/a/9041280/1112665

अपने कोड फ़ॉन्ट गिलहरी से है, तो यह हो सकता है अपने कुछ सीएसएस के क्रम को पुन: व्यवस्थित करने के रूप में सरल।

+0

ओह, दिलचस्प। मुझे इसे आज़माना है। मैंने फ़ॉन्ट-फेस को मिटाने से समस्या को ठीक किया (क्योंकि मूल लेआउट भी बदल गया है)। धन्यवाद! – omninonsense

0

आप यह भी सुनिश्चित कर सकते हैं कि एसवीजी प्रारूप मुख्य रूप से उपयोग किया जा रहा है। इसका अपवाद यह है कि फ़ॉन्ट ओपेरा/क्रोम में पूरी तरह प्रस्तुत करेगा, नीचे की ओर यह है कि मुझे लाइन-ऊंचाई के मुद्दे सामने आए हैं।

क्रोम विशिष्ट मीडिया क्वेरी का उपयोग करें और विशेष रूप से एसवीजी संस्करण के साथ फ़ॉन्ट को प्रतिस्थापित करें।