Skip to main content

सीएसएस विक्रेता या ब्राउज़र उपसर्ग क्या हैं?

CSS उपसर्ग क्या है? (जून 2026)

CSS उपसर्ग क्या है? (जून 2026)
Anonim

सीएसएस विक्रेता उपसर्ग, कभी-कभी या सीएसएस ब्राउज़र उपसर्ग के रूप में भी जाना जाता है, ब्राउज़र निर्माताओं के लिए नई सीएसएस सुविधाओं के लिए समर्थन जोड़ने का एक तरीका है इससे पहले कि उन सभी सुविधाओं में पूरी तरह से समर्थित हैं। यह एक प्रकार के परीक्षण और प्रयोग अवधि के दौरान किया जा सकता है जहां ब्राउज़र निर्माता यह निर्धारित कर रहा है कि इन नई सीएसएस सुविधाओं को कैसे लागू किया जाएगा। कुछ साल पहले CSS3 के उदय के साथ ये उपसर्ग बहुत लोकप्रिय हो गए।

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

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

सीएसएस ब्राउज़र उपसर्ग जो आप उपयोग कर सकते हैं (जिनमें से प्रत्येक एक अलग ब्राउज़र के लिए विशिष्ट है) हैं:

  • एंड्रॉयड:

    -webkit-

  • क्रोम:

    -webkit-

  • फ़ायरफ़ॉक्स:

    -moz-

  • इंटरनेट एक्स्प्लोरर:

    -सुश्री-

  • iOS:

    -webkit-

  • ओपेरा:

    -O-

  • सफारी:

    -webkit-

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

संक्रमण

जैसा कि नीचे दिखाया गया है:

-webkit- संक्रमण: सभी 4 एस आसानी से; -moz- संक्रमण: सभी 4 एस आसानी से; -सुश्री- संक्रमण: सभी 4 एस आसानी से; -O- संक्रमण: सभी 4 एस आसानी से;संक्रमण: सभी 4 एस आसानी से;

ध्यान दें: याद रखें, कुछ ब्राउज़रों के पास कुछ गुणों के लिए अलग-अलग गुणों के लिए एक अलग वाक्यविन्यास होता है, इसलिए यह न मानें कि किसी संपत्ति का ब्राउज़र-प्रीफ़िक्स्ड संस्करण मानक संपत्ति के समान ही है। उदाहरण के लिए, एक सीएसएस ढाल बनाने के लिए, आप का उपयोग करें

रैखिक ढलान

संपत्ति। क्रोम और सफारी के फ़ायरफ़ॉक्स, ओपेरा और आधुनिक संस्करण उपयुक्त प्रफिक्स के साथ उस संपत्ति का उपयोग करते हैं जबकि क्रोम और सफारी के शुरुआती संस्करण प्रीफिक्स्ड प्रॉपर्टी का उपयोग करते हैं

-webkit-ढाल

। साथ ही, फ़ायरफ़ॉक्स मानक मानों से अलग मानों का उपयोग करता है।

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

विक्रेता उपसर्ग एक हैक नहीं हैं

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

एक सीएसएस हैक एक और संपत्ति को सही तरीके से काम करने के लिए किसी अन्य तत्व या संपत्ति के कार्यान्वयन में त्रुटियों का फायदा उठाती है। उदाहरण के लिए, बॉक्स मॉडल हैक ने पार्सिंग में त्रुटियों का शोषण किया

आवाज परिवार

या ब्राउज़र कैसे बैकस्लेश पार्स करते हैं (

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

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

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

विक्रेता उपसर्ग परेशान लेकिन अस्थायी हैं

हां, यह सभी ब्राउज़रों में काम करने के लिए गुणों को 2-5 बार लिखना परेशान और दोहराया जा सकता है, लेकिन यह एक अस्थायी स्थिति है। उदाहरण के लिए, कुछ साल पहले, एक बॉक्स पर गोलाकार कोने सेट करने के लिए आपको लिखना था:

-मोज़-सीमा-त्रिज्या: 10 पीएक्स 5 पीएक्स;-वेबिट-सीमा-टॉप-बाएं-त्रिज्या: 10 पीएक्स;-वेबिट-सीमा-शीर्ष-दाएं-त्रिज्या: 5 पीएक्स;-वेबिट-सीमा-तल-दाएं-त्रिज्या: 10 पीएक्स;-वेबिट-सीमा-नीचे-बाएं-त्रिज्या: 5 पीएक्स;सीमा-त्रिज्या: 10 पीएक्स 5 पीएक्स;

लेकिन अब यह ब्राउज़र पूरी तरह से इस सुविधा का समर्थन करने आए हैं, आपको वास्तव में केवल मानक संस्करण की आवश्यकता है:

सीमा-त्रिज्या: 10 पीएक्स 5 पीएक्स;

क्रोम ने संस्करण 5.0 के बाद से CSS3 प्रॉपर्टी का समर्थन किया है, फ़ायरफ़ॉक्स ने इसे संस्करण 4.0 में जोड़ा है, सफारी ने इसे 5.0 में जोड़ा है, 10.5 में ओपेरा, 4.0 में आईओएस और 2.1 में एंड्रॉइड। यहां तक ​​कि इंटरनेट एक्सप्लोरर 9 भी उपसर्ग के बिना इसका समर्थन करता है (और आईई 8 और निचला इसे उपसर्ग के साथ या बिना समर्थन नहीं करता है)।

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