सीएसएस में मार्की - शुरुआती गाइड
मार्की को पहली बार इंटरनेट एक्सप्लोरर में पेश किया गया था और 90 के दशक में बहुत लोकप्रिय था, क्योंकि डब्ल्यू 3 सी ने अंततः प्रयोज्य मुद्दों के कारण इसे HTML मानक तत्व से बाहर करने का फैसला किया था। वेब डिजाइनरों को टैग का उपयोग न करने के लिए प्रोत्साहित किया गया.
हैरानी की बात है कि, अब मार्की एक टैग में नहीं, बल्कि वापसी कर रहा है प्रारूप ऐसा किया, लेकिन एक सीएसएस मॉड्यूल में। यह मॉड्यूल Webkit CSS विनिर्देश के भाग के रूप में उपलब्ध है और W3C वर्तमान में एक समान मॉड्यूल पर भी काम कर रहा है। हालाँकि, चूंकि W3C संस्करण अभी भी कैंडिडेट सिफारिश चरण में है, इसलिए यह अभी तक लागू नहीं है। इसलिए, इस समय, हम केवल वेबकिट विनिर्देश से कवर करेंगे.
सिंटेक्स
सबसे पहले, निम्नलिखित शॉर्टहैंड सिंटैक्स का उपयोग करके मार्की को परिभाषित किया जा सकता है.
-वेबकिट-मार्की: [दिशा] [वृद्धि] [पुनरावृत्ति] [शैली] [गति]
उपरोक्त सिंटैक्स में आवश्यक प्रत्येक मान, मेरा मानना है कि काफी आत्म-व्याख्यात्मक हैं, या फिर आप उन्हें इस दस्तावेज़ में पर्याप्त रूप से समझाया जा सकता है। इसलिए, यदि आप इस बात पर गहराई से खुदाई करना चाहते हैं कि यह सिंटैक्स कैसे काम करने वाला है, तो आप हमेशा पहले दस्तावेज़ को संदर्भित कर सकते हैं.
फिर, हमसे जुड़ें क्योंकि हम कुछ वास्तविक उदाहरण बनाने के लिए आगे बढ़ते हैं और देखते हैं कि यह कैसे कार्रवाई में है.
उदाहरण 1: पाठ को स्क्रॉल करना
सभी सही, पहले उदाहरण में हम मार्की के क्लासिक आंदोलन का निर्माण करेंगे जो पाठ को दाईं से बाईं ओर ले जा रहा है.
चलिए नीचे अपना टेक्स्ट मार्कअप बनाते हैं:
लॉलीपॉप टॉपिंग लेमन ड्रॉप्स जुजबस अप्लीकेशन फ्रूटकेक टार्ट एल्कोहल तिल के स्नैक्स.
फिर निम्नलिखित सिंटैक्स के साथ मार्की को परिभाषित करें.
-वेबकिट-मार्की: ऑटो मध्यम अनंत स्क्रॉल सामान्य; अतिप्रवाह- x: -webkit-marquee;
जब मार्की दिशा निर्धारित की जाती है ऑटो, यह दाईं ओर से बाईं ओर जाएगा; वैकल्पिक रूप से आप इस मान को बदल सकते हैं बाएं. यह भी ध्यान दें कि अतिप्रवाह-x संपत्ति के लिए सेट किया गया है -वेबकिट-मार्की ताकि सामग्री हमेशा एक की तरह काम करे। यदि आप इस गुण को छोड़ देते हैं, तो पाठ आगे नहीं बढ़ेगा.
डेमो देखें.
उदाहरण 2: आगे और पीछे उछालें
दूसरे उदाहरण में हम मार्की को एक अलग शैली देने की कोशिश करेंगे। इस समय हम उपयोग करते हैं वैकल्पिक के बजाय स्क्रॉल और दिशा मान को बदल दें सही. इस तरह, मार्की बाएं से दाएं ओर फिर आगे और पीछे उछल जाएगा.
-वेबकिट-मार्की: ऑटो मध्यम अनंत वैकल्पिक सामान्य; अतिप्रवाह- x: -webkit-marquee;
डेमो देखें
उदाहरण 3: पाठ को ऊपर की ओर ले जाना
और अंतिम उदाहरण के लिए, हम ऊपर की ओर बढ़ने के लिए मार्की दिशा को बदल देंगे। वहाँ दॊ है दिशा ऐसा करने के लिए मूल्य; आप मान को बदल सकते हैं ऊपर या आगे.
व्यक्तिगत रूप से मुझे ऐसा नहीं लगता कि वेबकिट ने दो मूल्य प्रदान किए हैं जो अनिवार्य रूप से एक ही काम करते हैं क्योंकि मुझे लगता है कि कुछ लोगों के लिए भ्रम पैदा हो सकता है.
-वेबकिट-मार्की: मध्यम अनंत स्क्रॉल सामान्य; अतिप्रवाह- x: -webkit-marquee;
डेमो देखें
इसके अलावा, मैंने कुछ और उदाहरण संकलित किए हैं, लेकिन यदि वे सभी यहां बताए गए हैं तो वे भारी पड़ जाएंगे.
लेकिन, आप सभी डेमो देख सकते हैं और नीचे दिए गए लिंक से स्रोतों को डाउनलोड कर सकते हैं.
- डेमो
- स्रोत डाउनलोड करें
अंतिम विचार और संदर्भ
मुझे पहली बार आश्चर्य हुआ कि मार्की में अभी भी रुचि है, जो मुझे लगा कि इसके अंत में मिला था। इसने मुझे यह प्रश्न करने के लिए प्रेरित किया कि इस तरह सीएसएस मॉड्यूल कैसे उपयोगी हो सकता है। वास्तव में हर ब्राउज़र अभी भी की विरासत का समर्थन कर रहा है टैग.
तो तुम क्या सोचते हो? क्या इस उम्र में भी मार्की प्रासंगिक है और क्या यह आधुनिक वेब डिज़ाइन में उपयोगी होगा?
यदि आप अभी भी इस मार्की सामान के बारे में उत्सुक हैं, तो आप निम्नलिखित कुछ संदर्भ देख सकते हैं:
- सफारी सीएसएस संदर्भ
- वेबकिट मार्की जनरेटर
- पुराने का व्यापक प्रलेखन
साइटपॉइंट से टैग. - और इस मार्की जेनरेटर सहित लगभग हर चीज के लिए हमेशा एक जनरेटर होता है.
