2012-07-02 12 views
71

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

पृथ्वी पर मैं इसे कैसे ठीक करूं?

+1

आपको एक उदाहरण है? इसके अलावा, कौन सा एंड्रॉइड और क्रोम संस्करण? – Junuxx

उत्तर

2

इसे "फ़ॉन्ट बूस्टिंग" कहा जाता है और इस WebKit bug में कुछ विस्तार से वर्णित है। वर्तमान में इसे अक्षम करने का कोई तरीका नहीं है।

2

मुझे अपने पृष्ठों के लिए एक समाधान मिला: मूल तत्व को चौड़ाई और ऊंचाई दें! फ़ॉन्ट उन सीमाओं के बाहर नहीं जायेगा, और इसलिए यह छोटा (एर) रहेगा।

82

उस तत्व को max-height: 999999px; जोड़ें जो आप फ़ॉन्ट को बढ़ावा देने या उसके माता-पिता को रोकने के लिए चाहते हैं।

<meta name="viewport" content="width=device-width, initial-scale=1">

यह सही ढंग से दृश्य फ्रेम स्थापित करेगा, और इस तरह "FontBoosting" की आवश्यकता को समाप्त:

+2

यह काम करता है ... कैसे आते हैं! – Laurent

+12

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

+1

इसके लिए बस एक चेतावनी। इसने एंड्रॉइड पर क्रोम फोंट के साथ अपनी समस्या को हल नहीं किया। ** हालांकि ** यह आईओएस के विशिष्ट संस्करणों पर साइट के आईपैड दृश्य को तोड़ दिया। –

54

दस्तावेज़ <head> में निम्नलिखित <meta> टैग शामिल करें।

+6

यह निश्चित रूप से पसंदीदा समाधान है।यदि आप मोबाइल पर चीजों को देखते हैं, तो अपने व्यूपोर्ट का स्वामित्व लें! –

+9

हालांकि यह फ़ॉन्ट बूस्टिंग को अक्षम नहीं करता है। –

+1

यह निश्चित रूप से अवांछित स्केलिंग को सुधारता है और मैं इसे भविष्य में उपयोग करने जा रहा हूं। – Dizzley

5

कुछ परीक्षणों के बाद इस नियम ने मेरी मदद की। Div/table संरचना के आधार पर बढ़ाए गए पाठ या उसके माता-पिता वाले तत्व में जोड़ा जाना चाहिए।

element or parent element { 
    /* prevent font boosting on mobile devices */ 
    width: 100%; 
    height: auto; 
    min-height: 1px; 
    max-height: 999999px; 
} 

शायद आपकी आवश्यकताओं के अनुसार चौड़ाई और हेगथ ​​मानों को सही किया जाना चाहिए।

14

इसे अपने रीसेट में रखें। html * {max-height:1000000px;}

+0

चिपचिपा पाद लेख के लिए मेरे साथ समस्याएं पैदा कर रहा था, एचटीएमएल बॉडी * इसके बजाय –

8

अब एक सीएसएस संपत्ति आप इस पर नियंत्रण के लिए सेट कर सकते हैं:

-webkit-text-size-adjust: none; 
-moz-text-size-adjust: none; 
-ms-text-size-adjust: none; 

देखें https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust

+0

टेक्स्ट-साइज-एडजस्ट करना था: आखिरी एंड्रॉइड क्रोम पर मेरे लिए कोई भी काम नहीं करता था। –