2013-04-14 8 views
9

मैं कुछ तत्वों अप पैमाने पर करने के सीएसएस transform:scale उपयोग कर रहा हूँ, और अब सीमाओं, जो मूल रूप से थे 1px solid black, कुछ उपपिक्सेल प्रतिपादन मिलता है - 'एंटीलायज़िंग़' - क्योंकि वे अब कर रहे हैं 1.4px या कुछ और। वास्तव में यह कैसा दिखता है ब्राउज़र पर निर्भर करता है, लेकिन यह सभी आधुनिक ब्राउज़रों पर धुंधला है।HTML/CSS पर अक्षम उपपिक्सेल अलियासिंग सीमाओं

क्या मैं कुछ तत्वों के लिए उप-पिक्सेल प्रतिपादन अक्षम कर सकता हूं?

+0

ब्राउज़र-विशिष्ट समाधान - जैसे सीएसएस विक्रेता उपसर्गों के साथ - बहुत स्वागत कर रहे हैं – commonpike

+0

... यदि आप को बदलने के लिए एक सीएसएस नियम का उपयोग /, अपने तत्वों पैमाने क्यों तुम सिर्फ इस एक ही नियम में सीमाओं को समायोजित नहीं है ??? – Cholesterol

+0

मुझे उल्लेख किया जाना चाहिए कि स्केल गतिशील था - जावास्क्रिप्ट के साथ किया गया। मैंने समान जावास्क्रिप्ट के साथ सीमा-चौड़ाई समायोजित करने की कोशिश नहीं की, उदाहरण के लिए सीमा-चौड़ाई: 0.71 पीएक्स या कुछ - शायद एक समाधान हो सकता है। – commonpike

उत्तर

0

आप इस सीएसएस के साथ वेबकिट पर टेक्स्ट एंटीअलाइजिंग को नियंत्रित कर सकते हैं: -webkit-font-smoothing: antialiased; और कभी-कभी 3 डी त्वरण को कुछ के साथ मजबूर करना: -webkit-transform: translate3d (0, 0, 0); एलियासिंग के साथ-साथ कम से कम मदद करता है (कम से कम मेरे अनुभव में घूर्णन का उपयोग करते समय)।

+0

धन्यवाद, और सही, लेकिन मैं गैर-पाठ तत्वों पर विशेष रूप से सीमाओं पर अलियासिंग प्रभाव मांग रहा था। ये '-webkit-font-smoothing' से प्रभावित नहीं हैं और translateZ चाल का कोई प्रभाव नहीं पड़ा ... – commonpike

2

यह धुंधला है क्योंकि 72 डीपीआई के मानक डिस्प्ले आंशिक पिक्सेल आकार प्रस्तुत नहीं कर सकते हैं, क्योंकि मुझे यकीन है कि आप समझते हैं। इसके अलावा, सीमाओं के प्रतिपादन या अलियासिंग को प्रभावित करने के लिए nothing within the spec है।

2 की पिक्सेल चौड़ाई आपको बेहतर परिणाम दे सकती है, फिर भी बस सब कुछ धुंधला हो जाएगा।

कुछ रेटिना डिवाइस और डिस्प्ले sub-pixel border widths का समर्थन करते हैं लेकिन क्रॉस-ब्राउज़र समर्थन की बात होने पर कोई लगातार समाधान नहीं होते हैं।

अपने स्वयं के परीक्षण में, मुझे कोने से स्केल करते समय बेहतर परिणाम मिलते हैं, डिफ़ॉल्ट रूप से केंद्र के विपरीत। साथ ही तिमाही या आधा रकम में कदम उठाना।

transform: scale(1.25); 
transform-origin: left top; 
संबंधित मुद्दे