ते काय आहेत आणि आपण त्यांना का वापरावे
सीएसएस व्हेंडर प्रिफिक्स, जे कधीकधी किंवा सीएसएस ब्राउजर प्रिफिक्स म्हणून ओळखले जातात, हे सर्व ब्राउजरमध्ये पूर्णतया समर्थीत होण्याआधीच ब्राउझर निर्मात्यांना नवीन सीएसएस वैशिष्ट्यांसाठी आधार जोडण्याचा एक मार्ग आहे. हे एक प्रकारचे चाचणी आणि प्रयोग कालावधी दरम्यान केले जाऊ शकते जिथे ब्राउझर निर्माता हे ठरविते की ही नवीन CSS वैशिष्ट्ये कशी लागू होतील हे प्रत्यये काही वर्षांपूर्वी CSS3 च्या उदयानुरूप लोकप्रिय झाले.
जेव्हा CCS3 प्रथम सादर केले गेले होते, तेव्हा अनेक उत्साहित मालमत्ता वेगवेगळ्या वेळी भिन्न ब्राउझर मारण्यास सुरुवात केली. उदाहरणार्थ, वेबकिट-समर्थित ब्राउझर (सफारी आणि क्रोम) हे प्रथम काही जणांनी अॅनिमेशन-शैलीतील गुणधर्म जसे, परिवर्तन आणि संक्रमण असे प्रस्तुत केले. व्हेंडर प्रिफिक्स्ड प्रॉपर्टी वापरुन, वेब डिझाइनर त्या नवीन वैशिष्ट्यांचा आपल्या कामात वापर करू शकला आणि प्रत्येक ब्राउजर निर्माता कंपनीला पकडण्यासाठी प्रतीक्षा करण्याऐवजी त्यांना ताबडतोब पाठिंबा देत असलेल्या ब्राऊझरवर पाहिले.
त्यामुळे फ्रंट-एंड वेब डेव्हलपरच्या दृष्टीकोनातून, ब्राऊझर प्रिफिक्सचा उपयोग साइटवर नवीन सीएसएस फीचर्स जोडण्यासाठी केला जातो, तर ब्राऊजर त्या स्टाईलचे समर्थन करतील याची जाणीव असते. हे विशेषतः उपयोगी होऊ शकतात जेव्हा भिन्न ब्राउझर निर्माते गुणधर्मांची अंमलबजावणी थोड्या वेगळ्या प्रकारे किंवा वेगळ्या मांडणीसह करते.
आपण वापरु शकणारे CSS ब्राउझर प्रिफिक्स (प्रत्येक एक भिन्न ब्राउझरसाठी विशिष्ट आहे) हे आहेत:
- Android: -webkit-
- Chrome: -webkit-
- Firefox: -मोझ-
- इंटरनेट एक्सप्लोरर: -एमएमएस-
- iOS: -webkit-
- ऑपेरा: -ओ-
- सफारी: -webkit-
बर्याच बाबतीत, एक नवीन सीएसएस शैली गुणधर्म वापरण्यासाठी, आपण मानक सीएसएस गुणधर्म घ्या आणि प्रत्येक ब्राउझरसाठी उपसर्ग जोडा. सामान्य सीएसएस गुणधर्म अंतिम असेल तर उपेक्षित आवृत्त्या नेहमी प्रथम (आपण कोणत्याही क्रमाने प्राधान्य देता) नेहमी दिसतील. उदाहरणार्थ, आपण आपल्या दस्तऐवजात CSS3 संक्रमण जोडू इच्छित असल्यास, आपण खाली दर्शवलेल्या संक्रमण मालमत्तेचा वापर कराल:
-webkit- संक्रमण: सर्व 4s सोपी;
-मोझ- संक्रमण: सर्व 4 एस सहजपणे;
-एमएमएस- संक्रमण: सर्व 4S सोयीस्कर;
-o- संक्रमण: सर्व 4s सोपी;
संक्रमण: सर्व 4S सोयीस्कर;
टीप: लक्षात ठेवा, काही ब्राउझरना इतरांपेक्षा विशिष्ट गुणधर्मांसाठी वेगळे वाक्यरचना असते, म्हणून असे समजू नका की मालमत्तेची ब्राउझर-प्रिफिक्स केलेली आवृत्ती मानक मालमत्ता प्रमाणेच आहे. उदाहरणार्थ, सीएसएस ग्रेडियंट तयार करण्याकरिता, तुम्ही रेखीय-ग्रेडीयंट प्रॉपर्टी चा वापर करता. क्रोम आणि सफारीच्या फायरफॉक्स, ऑपेरा, आणि आधुनिक आवृत्त्या या प्रॉपर्टीचा वापर योग्य उपसर्ग सह करतात जेव्हा की क्रोम आणि सफारीच्या सुरुवातीच्या आवृत्त्या प्रीफिक्स्ड प्रॉपर्टी वापरतात - वेबकीट-ग्रेडिएंट. तसेच, फायरफॉक्स मानक पेक्षा भिन्न मूल्ये वापरते.
आपण नेहमी आपल्या घोषणापत्र नेहमी सामान्य संपल्यावर, सीएसएस प्रॉपर्टीच्या प्रि-प्रिक्स्ड आवृत्तीमध्ये ठेवण्याचा हेतू आहे जेणेकरून जेव्हा एखादा ब्राऊजर नियमाचे समर्थन करेल, तेव्हा तो त्याचा वापर करेल. CSS कसे वाचले जाते ते लक्षात ठेवा. जर विशिष्टता समान असेल तर नंतरच्या नियमांपेक्षा आधीच्या नियमांना प्राधान्य दिले जाते, जेणेकरून एखादा ब्राऊजर नियमाच्या विक्रेत्याच्या आवृत्तीचे वाचन करेल आणि वापरेल जर ते सामान्य समस्येला समर्थन देत नसेल, परंतु एकदा का ते तसे करेल, तेव्हा ते विक्रेत्याच्या आवृत्तीस अधिलिखित करेल प्रत्यक्ष सीएसएस नियम
विक्रेता उपसर्ग एक खाच नाहीत
जेव्हा व्हेंडरचे प्रत्यय प्रथम लावण्यात आले, तेव्हा अनेक वेब व्यावसायिकांनी असा विचार केला की जर ते हॅक झाले किंवा परत वेगवेगळ्या ब्राऊझर्सच्या सहाय्याने वेबसाइटचे कोड ओढण्यासाठी गडद दिवसांकडे वळले (लक्षात ठेवा की " या साइटवर IE मध्ये सर्वोत्तम दिसत आहे " संदेश). सीएसएस विक्रेते उपसर्ग हे हॅक्स नाहीत, आणि आपल्या कामात त्यांना वापरण्याबद्दल आपल्याकडे कोणतीही आरक्षणे नसतील.
अन्य गुणधर्म किंवा मालमत्ता योग्यरितीने कार्य करण्यासाठी इतर गुणधर्म किंवा मालमत्तेच्या अंमलबजावणीमध्ये सीएसएस हॅक कमतरतेचे शोषण करते. उदाहरणार्थ, बॉक्स मॉडेल व्हॉइस-प्रॉपर्टी प्रॉपर्टीचे विश्लेषण करताना किंवा ब्राउझर बॅकस्लॅश (\) मध्ये कसे पॅक करते हे शोषण केलेल्या दोषांचे निराकरण करते. पण हे हॅक इंटरनेट एक्स्प्लोरर 5.5 ने बॉक्स मॉडेल कसे हाताळतात आणि नेटस्केपने याचे भाषांतर कसे केले आणि व्हॉइस कौटुंबिक शैलीशी काहीच संबंध नसल्याच्या फरक समस्येचे निराकरण करण्यासाठी वापरले गेले. कृतज्ञतापूर्वक या दोन कालबाह्य ब्राउझरमध्ये आम्हाला या दिवसांबद्दल स्वत: ची चिंता येत नाही.
एक विक्रेता प्रिफिक्स एक खाच नाही कारण हे विशिष्टता कशा प्रकारे कार्यान्वित केली जाऊ शकते यासाठी नियम सेट करण्याची परवानगी देते, त्याच वेळी ब्राउझर निर्मात्यांना प्रत्येक गोष्ट न सोडता वेगळ्या प्रकारे मालमत्ता अंमलबजावणीची अनुमती मिळते. यापुढे, हे प्रिफिक्स CSS गुणधर्मांसह कार्यरत आहेत जे अखेरीस सूचनेचा एक भाग असेल . आम्ही मालमत्तेचा प्रवेश लवकर मिळवण्यासाठी काही कोड जोडत आहोत. हे आपण सामान्य, अप्रमाणित मालमत्तेसह सीएसएस नियम समाप्त का हे आणखी एक कारण आहे. अशा प्रकारे आपण संपूर्ण ब्राउझर समर्थन प्राप्त झाल्यानंतर उपसर्ग आवृत्ती ड्रॉप करू शकता.
विशिष्ट वैशिष्ट्यासाठी ब्राउझरचे समर्थन काय आहे हे जाणून घेऊ इच्छिता? वेबसाईट CanIUse.com ही माहिती एकत्रित करण्यासाठी आणि आपल्याला कोणती ब्राउझर, आणि त्या ब्राउझरच्या कोणत्या आवृत्त्या, सध्या एखाद्या वैशिष्ट्याला समर्थन देतात हे कळविण्यासाठी एक अद्भुत स्त्रोत आहे.
विक्रेता प्रिफिक्सिस त्रासदायक परंतु तात्पुरते आहेत
होय, हे गुणधर्म दोन-पाच वेळा लिहुन घेण्यासाठी सर्व ब्राउझरमध्ये कार्य करण्यासाठी त्रासदायक आणि पुनरावृत्ती होऊ शकते, परंतु ही एक तात्पुरती स्थिती आहे उदाहरणार्थ, फक्त काही वर्षांपूर्वी, आपल्याला लिहिण्याची गरज होती त्या बॉक्सवर एक गोलाकार कोपरा सेट करण्यासाठी:
-मोझ-सीमा-त्रिज्या: 10px 5px;
-विबिट-सीमा-शीर्ष-डावा-त्रिज्या: 10 पीएक्स;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 5px;
सीमा-त्रिज्या: 10px 5px;
परंतु आता हे ब्राऊझर या वैशिष्ट्याचा पूर्णपणे समर्थन करण्यासाठी आले आहेत, आपल्याला खरच प्रमाणित आवृत्तीची आवश्यकता आहे:
सीमा-त्रिज्या: 10px 5px;
आवृत्ती 5.0 पासून क्रोमने CSS3 प्रॉपर्टीचे समर्थन केले आहे, फायरफॉक्सने यास 4.0 आवृत्तीमध्ये जोडले आहे, सफारीने त्यात 5.0, 10.5 ओपेरा, 4.0 मध्ये फरक, आणि 2.1 मध्ये 2.1 मध्ये ओपेरा जोडला आहे. जरी इंटरनेट एक्सप्लोरर 9 हे उपसर्ग (आणि IE 8 आणि कमीत कमी ऑप्लिकेशन्ससह किंवा त्यास समर्थन देत नसल्यास) चे समर्थन करते.
लक्षात ठेवा की ब्राउझर नेहमीच बदलत राहतील आणि जुने ब्राऊझरच्या सहाय्याने सर्जनशील पध्दतीची आवश्यकता नाही जोपर्यत आपण बहुतेक आधुनिक पद्धतींच्या मागे वर्षानुवर्षे असलेल्या वेब पृष्ठांच्या बांधणीवर नियोजन करीत नाही. सरतेशेवटी, ब्राउझर प्रिफिक्स लिहिताना त्रुटी शोधणे आणि शोषण करणे जास्त सोपे आहे जो भविष्यकालीन आवृत्तीत निश्चितपणे निश्चित केले जातील, ज्यामुळे आपल्याला शोषणाकरिता दुसरी त्रुटी सापडेल आणि अशीच आवश्यकता आहे