2011-08-19 11 views
5

समेत सभी ब्राउज़रों के लिए सीएसएस 3 और एचटीएमएल 5 संगत वेबसाइट कैसे बनाएं, क्या कोई एकल ढांचा है जिसके साथ मैं एक सीएसएस 3, एचटीएमएल 5 वेबसाइट बना सकता हूं जो आईई 7 और बाद में सभी ब्राउज़रों के लिए संगत है? http://html5boilerplate.com/ बॉयलरप्लेट इस में मेरी सहायता कर सकता है?आईई 7 और बाद में

+0

क्यों -1? क्या इस सवाल के साथ कोई समस्या है? – Yasir

+0

कूल -2 कोई भी, क्यों? – Yasir

+2

यह एक गुमराह प्रश्न है जो एचटीएमएल 5 और CSS3 का प्रतिनिधित्व करता है और आधुनिक दुनिया में वेब विकास के दृष्टिकोण के बारे में एक मूलभूत गलतफहमी को इंगित करता है, जिससे किसी भी उचित तरीके से जवाब देना मुश्किल हो जाता है। यह एक ढांचा नहीं है जो आपकी साइट को संगत बनाने जा रहा है, यह केवल उन सुविधाओं का उपयोग कर रहा है जो उन सभी ब्राउज़रों में काम करते हैं, जिन्हें आप अपनी साइट पर काम करना चाहते हैं, जिससे यह संगत हो जाता है। आप एचटीएमएल 5 spec के हिस्सों का उपयोग कर सकते हैं जो HTML4 से अपरिवर्तित मौजूद हैं, आप CSS3 के उन हिस्सों का उपयोग कर सकते हैं जो सीएसएस 2 से अपरिवर्तित मौजूद हैं, क्या यह इसे HTML5 और CSS3 वेबसाइट बना देगा? – robertc

उत्तर

13

आप कभी एचटीएमएल 5, CSS3 और अन्य आधुनिक तकनीकों के साथ पूर्ण संगतता प्राप्त करने के लिए आईई 7 या आईई 8 रेंडरिंग इंजन प्राप्त करेंगे। वे बस इसके लिए सक्षम नहीं हैं।

हालांकि कुछ हैक्स, टूल्स और प्लगइन्स हैं जो आपको रास्ते का हिस्सा ले सकते हैं।

Modernizr जैसे टूल्स आपको यह पता लगाने में मदद करेंगे कि कौन सी सुविधाएं समर्थित हैं, ताकि आपकी साइट को इसके आसपास काम करने का मौका दिया जा सके।

jQuery वैसे भी एक महान पुस्तकालय है, लेकिन इस संदर्भ में विशेष रूप से अच्छा है क्योंकि यह डेवलपर से बहुत सारे ब्राउज़र अंतर को दूर करता है। अधिकांश ब्राउज़रों में कुछ चीजें आसान होती हैं लेकिन आईई में वास्तविक दर्द होता है; jQuery उस तरह की चीजें लेता है और इसे बिना किसी पर ध्यान देता है।

Dean Edwards' IE7.js और Selectivzr दोनों जावास्क्रिप्ट पुस्तकालय हैं जो पुराने संस्करणों में गायब होने वाले कई सीएसएस चयनकर्ताओं के लिए आईई समर्थन देते हैं। यह आपको आईई का समर्थन करने के बारे में बहुत चिंता किए बिना अपनी स्टाइलशीट लिखने की अनुमति देता है। (IE7.js भी IE के अन्य खामियों के एक नंबर को ठीक करता है और लापता भी शामिल हैं)

CSS3Pie कि सीएसएस border-radius, ढ़ाल और box-shadow लिए समर्थन जोड़ता है IE के लिए एक हैक है।

वास्तव में इन पंक्तियों के साथ हैक्स का एक पूरा भार है, जिसका उद्देश्य आईई के पुराने संस्करणों में सुविधाओं को जोड़ने का लक्ष्य है, जो गायब है। मॉडर्निज़र की वेबसाइट में उनकी एक बड़ी सूची है: https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills

हालांकि इन सभी के लिए एक बड़ी चेतावनी है। स्पीड। आईई < = 8 एक धीमी ब्राउज़र है। इसमें धीमा जावास्क्रिप्ट इंजन है। वास्तव में इन सभी हैक्स जावास्क्रिप्ट आधारित हैं। आप किसी भी साइट पर उनमें से कुछ को चलाने के साथ दूर हो सकते हैं, लेकिन आईई को एचटीएमएल 5 और CSS3 के लिए पूर्ण समर्थन की तरह कुछ भी देने के लिए पर्याप्त उपयोग करने की कोशिश कर रहे हैं ब्राउज़र को अनुपयोगी होने के बिंदु पर धीमा कर देगा।

हालांकि इस प्रश्न से संपर्क करने के लिए एक और कोण है, और यह आईई के लिए Google की फ़्रेम प्लगइन है। यह मूल रूप से पूरे Google क्रोम ब्राउज़र इंजन को IE में स्थापित करता है। उपयोगकर्ता अभी भी आईई खोल चला रहा है, लेकिन वेब पेज प्रस्तुत किया गया है क्योंकि यह क्रोम के एक अद्यतित संस्करण में होगा।

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

अंत में, आपको CanIUse.com में भी रुचि हो सकती है, जो विभिन्न सुविधाओं के लिए ब्राउज़र समर्थन तालिकाओं देता है, जो आपको एक नज़र में देखने की अनुमति देता है और प्रत्येक ब्राउज़र के विभिन्न संस्करणों में क्या समर्थित नहीं है।

0

Modernizr एक ओपन-सोर्स जावास्क्रिप्ट लाइब्रेरी है जो आपको अगली पीढ़ी के HTML5 और CSS3 संचालित वेबसाइटों का निर्माण करने में मदद करती है। परियोजनाओं

एमएस ASP.net MVC टेम्पलेट में शामिल है

+0

उत्तर के लिए धन्यवाद लेकिन मुझे नहीं लगता कि आधुनिकता का उपयोग करके मैं सभी ब्राउज़र पर एक ही प्रभाव या शैली प्राप्त कर सकता हूं जैसे आईई 8 में भी नहीं ... Faruk Ateş http://www.alistapart.com/d/taking द्वारा उदाहरण है -dvantage-of-html5-and-css3-with-modernizr/sample-advanced.html छवि घूर्णन नहीं कर रही है, @ फ़ॉन्ट-फेस काम नहीं कर रहा है ... – Yasir

+2

कोई चांदी की गोली नहीं है, क्षमा करें, Modernizr मदद करेगा – smallmouse

1

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

चेक आउट: http://accessites.org/site/2007/02/graceful-degradation-progressive-enhancement/

और: http://diveintohtml5.ep.io/detect.html

गुड लक।

0

html5boilerplate आपकी मदद नहीं करेगा।

जैसा कि अन्य ने कहा है कि एचटीएमएल 5 और सीएसएस 3 बहुत व्यापक शब्द हैं, इनमें कोई ढांचा नहीं है जो इन दोनों द्वारा प्रदान की जाने वाली सभी सुविधाओं को लागू करता है। वास्तव में वे ब्राउज़र में समान रूप से समर्थित नहीं हैं जो कहते हैं कि वे उनका समर्थन करते हैं। और अधिक, यहां तक ​​कि डब्ल्यू 3 सी लोग (जो एचटीएमएल 5 और सीएसएस 3 के लिए चश्मे लिखते हैं) अभी तक स्थापित नहीं हैं कि वे किस विशेषताओं को शामिल करेंगे या उन्हें लागू करने के लिए क्या कदम उठाने होंगे। आपको विचार मिलता है ...

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