यदि आपने कभी भी HTML तत्वों की एक सूची देखी है, तो हो सकता है कि आपने खुद को "ब्लॉकक्वॉट क्या है?" ब्लॉकक्वाइट तत्व एक HTML टैग जोड़ी है जिसका प्रयोग लंबे कोटेशन को परिभाषित करने के लिए किया जाता है। W3C HTML5 विनिर्देश के अनुसार इस तत्व की परिभाषा यहां दी गई है:
ब्लॉकक्वॉइट तत्व एक सेक्शन का प्रतिनिधित्व करता है जिसे किसी अन्य स्रोत से उद्धृत किया जाता है।
अपने वेबपृष्ठों पर ब्लॉकक्वाट का उपयोग कैसे करें
जब आप किसी वेब पेज पर टेक्स्ट लिख रहे होते हैं और उस पृष्ठ के लेआउट को बनाते हैं, तो आप कभी-कभी टेक्स्ट के ब्लॉक को उद्धरण के रूप में कॉल करना चाहते हैं। यह कहीं और से उद्धरण हो सकता है, जैसे एक ग्राहक प्रशंसापत्र जो केस स्टडी या परियोजना सफलता की कहानी के साथ होता है। यह एक डिज़ाइन उपचार भी हो सकता है जो लेख या सामग्री से कुछ महत्वपूर्ण पाठ दोहराता है। प्रकाशन में, इसे कभी-कभी पुल-कोट कहा जाता है, वेब डिज़ाइन में, इसे प्राप्त करने के तरीकों में से एक (और जिस तरीके से हम इस आलेख में शामिल हैं) को ब्लॉकक्वाइट कहा जाता है।
तो चलिए देखते हैं कि आप लंबी कोटेशन को परिभाषित करने के लिए ब्लॉकक्वाट टैग का उपयोग कैसे करेंगे, जैसे लुईस कैरोल द्वारा "द जैबरवॉकी" से यह अंश:
'Twas brillig और slithey tovesWabe में gyre और gimble किया था:सभी mimsy borogoves थे,और मोम raths outgrabe।
(लुईस कैरोल द्वारा)
ब्लॉकक्वोट टैग का उपयोग करने का उदाहरण
ब्लॉकक्वाट टैग एक अर्थपूर्ण टैग है जो ब्राउज़र या उपयोगकर्ता एजेंट को बताता है कि सामग्री एक लंबी उद्धरण है। इस प्रकार, आपको उस पाठ को संलग्न नहीं करना चाहिए जो ब्लॉकक्वाट टैग के अंदर उद्धरण नहीं है। याद रखें, एक "उद्धरण" अक्सर वास्तविक शब्द होता है जिसे किसी ने बाहरी स्रोत से कहा है या पाठ (जैसे इस लेख में लुईस कैरोल टेक्स्ट), लेकिन यह कर सकते हैं पुलक्वॉट अवधारणा भी है जिसे हमने पहले कवर किया था। जब आप इसके बारे में सोचते हैं, तो वह पुलक्वॉट टेक्स्ट का उद्धरण है, यह उसी लेख से होता है जो उद्धरण स्वयं प्रकट होता है।
अधिकांश वेब ब्राउज़र अवरोध के दोनों तरफ कुछ इंडेंटिंग (लगभग 5 रिक्त स्थान) को आस-पास के पाठ से बाहर खड़े करने के लिए जोड़ते हैं। कुछ बेहद पुराने ब्राउज़र इटालिक्स में उद्धृत पाठ भी प्रस्तुत कर सकते हैं। याद रखें कि यह ब्लॉकक्वाइट तत्व की डिफ़ॉल्ट स्टाइल है। सीएसएस के साथ, आपके ब्लॉकक्वाट को प्रदर्शित करने के तरीके पर आपका पूरा नियंत्रण है। उद्धरण को आगे कॉल करने के लिए आप इंडेंट को बढ़ा सकते हैं या यहां तक कि हटा सकते हैं, पृष्ठभूमि रंग जोड़ सकते हैं या टेक्स्ट आकार बढ़ा सकते हैं। आप उस उद्धरण को पृष्ठ के एक तरफ तैर सकते हैं और इसके चारों ओर अन्य टेक्स्ट लपेट सकते हैं, जो मुद्रित पत्रिकाओं में पुलक्वॉट्स के लिए उपयोग की जाने वाली एक आम दृश्य शैली है। आपके पास सीएसएस के साथ ब्लॉकक्वाट की उपस्थिति पर नियंत्रण है, कुछ हम जल्द ही कुछ और चर्चा करेंगे। अभी के लिए, आइए देखें कि उद्धरण को अपने HTML मार्कअप में कैसे जोड़ना है।
अपने पाठ में ब्लॉकक्वाट टैग जोड़ने के लिए, बस उस टैग को घेर लें जो निम्न टैग जोड़ी के साथ उद्धरण है -
उदाहरण के लिए:
'Twas brillig और slithey toves Wabe में gyre और gimble किया था: सभी mimsy borogoves थे, और मोम raths outgrabe।जैसा कि आप देख सकते हैं, आप बस उद्धरण की सामग्री के चारों ओर ब्लॉकक्वाट टैग की जोड़ी जोड़ते हैं। इस उदाहरण में, हमने टेक्स्ट के अंदर उचित सिंगल लाइन ब्रेक जोड़ने के लिए कुछ ब्रेक टैग () का भी उपयोग किया। ऐसा इसलिए है क्योंकि हम एक कविता से पाठ को पुनर्जीवित कर रहे हैं, जहां उन विशिष्ट ब्रेक महत्वपूर्ण हैं। यदि आप ग्राहक प्रशंसापत्र उद्धरण बना रहे थे, और लाइनों को विशिष्ट भागों में तोड़ने की आवश्यकता नहीं थी, तो आप इन ब्रेक टैग को जोड़ना नहीं चाहते हैं और ब्राउज़र आकार को स्क्रीन आकार के आधार पर आवश्यक रूप से लपेटने और तोड़ने की अनुमति देते हैं।
इंडेंट टेक्स्ट में ब्लॉकक्वाट का उपयोग न करें
कई सालों तक, लोग ब्लॉकक्वाट टैग का इस्तेमाल करते थे, अगर वे अपने वेबपृष्ठ पर टेक्स्ट इंडेंट करना चाहते थे, भले ही वह टेक्स्ट पुलक्वॉट न हो। यह एक बुरा अभ्यास है! आप केवल दृश्य कारणों से ब्लॉकक्वाट के अर्थशास्त्र का उपयोग नहीं करना चाहते हैं। यदि आपको अपना टेक्स्ट इंडेंट करने की आवश्यकता है, तो आपको स्टाइल शीट्स का उपयोग करना चाहिए, न कि ब्लॉकक्वॉट टैग (जब तक, निश्चित रूप से, जो आप इंडेंट करने का प्रयास कर रहे हैं वह उद्धरण है!)। यदि आप इंडेंट जोड़ने की कोशिश कर रहे हैं तो इस कोड को अपने वेब पेज में डालने का प्रयास करें:
यह टेक्स्ट होगा जो इंडेंट है।
इसके बाद, आप उस वर्ग को सीएसएस शैली के साथ लक्षित करेंगे
दिमागी {
पैडिंग: 0 10 पीएक्स;}
यह पैराग्राफ के दोनों तरफ 10 पिक्सल पैडिंग जोड़ता है।
