वेब डेवलपर्स का सामना करने वाली सबसे बड़ी दुविधाओं में से एक वर्तमान वेब मानकों के साथ विभिन्न इंटरनेट एक्सप्लोरर संस्करणों की असंगतता है। हालांकि माइक्रोसॉफ्ट ने आईई 9, विंडोज उपयोगकर्ताओं, विशेष रूप से व्यवसायों के लिए CSS3 और यहां तक ​​कि एचटीएमएल 5 का समर्थन करने का वादा किया है, आने वाले वर्षों के लिए IE8, IE7, या यहां तक ​​कि डरावनी आईई 6 का उपयोग जारी रख सकता है।

नतीजतन, विशेष CSS3 सुविधाओं वाली साइट को कोड करने से आपकी वेबसाइट के विज़िटर का एक बड़ा हिस्सा केवल उन्मूलन हो जाएगा, और मोज़िला फ़ायरफ़ॉक्स या Google क्रोम जैसे मानक-अनुरूप ब्राउज़र डाउनलोड करने के लिए उन्हें बाध्य करने के लिए केवल अहंकारी के रूप में आ जाएगा।

समस्या का एक संभावित समाधान एक आधुनिकीकरण का उपयोग करना है, जो एक स्क्रिप्ट या एप्लिकेशन है जो आपकी साइट को सभी ब्राउज़रों में दिखने के लिए विभिन्न प्रकार की चाल का उपयोग करता है। CSS3 पाई जावास्क्रिप्ट-आधारित आधुनिकीकरण है जो इंटरनेट एक्सप्लोरर को गोलाकार कोनों, मुलायम ड्रॉप छाया, और ढाल भरने जैसी शानदार CSS3 सुविधाओं को पहचानने में सहायता करता है। यह बहुत तेज़, आसान है, और बहुत कम समय के साथ काम करता है।

स्थापना और सेटअप

यह संक्षिप्त ट्यूटोरियल मानता है कि आपके पास पहले से ही CSS3 तत्वों वाली वेबसाइट है। CSS3 पाई काम करने के लिए, आपको दो चीजें करने की आवश्यकता है: जावास्क्रिप्ट पैकेज अपलोड करें और अपनी सीएसएस फ़ाइल में विशेष कोड जोड़ें।

1. css3pie.com वेबसाइट से डाउनलोड में कई फाइलें शामिल हैं, लेकिन यदि सबकुछ योजनाबद्ध हो जाता है, तो आपको केवल PIE.htc की आवश्यकता है, जो एक संपीड़ित टेक्स्ट फ़ाइल है। इसे अपने वेब सर्वर पर किसी स्थान पर अपलोड करें जहां आपकी सीएसएस फ़ाइल तक पहुंच हो सकती है।

2. अपनी सीएसएस फ़ाइल को अपने टेक्स्ट एडिटर में खोलें और उन तत्वों का पता लगाएं जिनमें CSS3 गुण हैं। उन तत्वों के भीतर, निम्न नियम जोड़ें:

 व्यवहार: यूआरएल (पीआईईएचटीसी);

आपके PIE.htc फ़ाइल का पथ सटीक होना चाहिए, इसलिए यदि यह आपकी सीएसएस फ़ाइल के समान निर्देशिका में नहीं है, तो तदनुसार इसे बदलें।

अंतिम तत्व इस तरह कुछ दिखना चाहिए:

 # तत्व 1 {सीमा: 1 पीएक्स ठोस # 696; पैडिंग: 60 पीएक्स 0; पाठ-संरेखण: केंद्र; चौड़ाई: 200 पीएक्स; -वेबिट-सीमा-त्रिज्या: 8 पीएक्स; -मोज़-सीमा-त्रिज्या: 8 पीएक्स; सीमा-त्रिज्या: 8 पीएक्स; पृष्ठभूमि: # ईईएफएफ 99; व्यवहार: यूआरएल (पीआईईएचटीसी); }

यदि यह सही ढंग से काम करता है, तो आपको संशोधित सीएसएस फ़ाइल अपलोड करने के तुरंत बाद आईई 6, 7, और 8 में परिणाम देखना चाहिए।

समस्या निवारण

यदि आपको कोई बदलाव नहीं दिखता है, तो आपको अपने PIE.htc के पथ को समायोजित करने की आवश्यकता हो सकती है या यहां तक ​​कि पूर्ण यूआरएल का उपयोग भी किया जा सकता है। बस याद रखें कि आईई केवल साइट के समान डोमेन से एचटीसी फ़ाइल स्वीकार करेगा, और "www.site.com" और "site.com" को दो अलग-अलग डोमेन माना जाता है।

कुछ परिस्थितियों में, आपको इसे सही तरीके से काम करने के लिए PIE_uncompressed.htc या यहां तक ​​कि PIE.php को आजमाने की आवश्यकता हो सकती है। अधिक जानकारी के लिए प्रलेखन से परामर्श लें।

मैंने देखा है कि पारदर्शिता और बोल्ड टेक्स्ट का संयोजन IE8 में कुछ पागल दिखने वाले शब्दों में होता है। आपको अभी भी उन परिस्थितियों में पारदर्शी छवि पृष्ठभूमि का उपयोग करने की आवश्यकता हो सकती है।

CSS3 पाई और कुछ jQuery फ़ंक्शंस का संयोजन IE में एक त्रुटि उत्पन्न करता प्रतीत होता है। मुझे इसके लिए कोई समाधान नहीं मिला है, लेकिन पृष्ठ अभी भी लोड हो गया है और इसके बावजूद सही तरीके से प्रदर्शित होता है।

आधुनिकीकरण

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