यदि तपाईंले कहिल्यै एचटीएमएल तत्वहरूको सूची देख्नुभयो भने, तपाईंले आफैलाई सोध्नुभएको छ "ब्लकक्वाट के हो?" ब्लकक्वाइट तत्त्व HTML ट्याग जोडी जो लामो उद्धरणहरू परिभाषित गर्न प्रयोग गरिन्छ। यहाँ यस तत्वको परिभाषा W3C एचटीएमएल 5 निर्दिष्टीकरण अनुसार हो:
ब्लकक्वाइट तत्व एक सेक्शन को प्रतिनिधित्व गर्दछ जुन अर्को स्रोतबाट उद्धृत गरिएको छ।
तपाईंको वेबपेजहरूमा ब्लकक्वाट कसरी प्रयोग गर्ने
जब तपाइँ वेब पृष्ठमा पाठ लेख्दै र त्यो पृष्ठको लेआउट सिर्जना गर्दै हुनुहुन्छ, कहिलेकाहीं पाठको ब्लक एक उद्धरणको रूपमा कल गर्न चाहानुहुन्छ।
यो कहीं र एक उद्धरण हुन सक्छ, एक ग्राहक प्रशंसापत्र जस्तै कि एक मामला अध्ययन संग या परियोजना सफलता को कहानी संग। यो पनि डिजाइन डिजाइन हुन सक्छ जुन लेख वा सामग्रीबाट केही महत्त्वपूर्ण पाठ दोहोरिन्छ। प्रकाशनमा, यो कहिलेकाहीँ एक पुल-उद्धरण भनिन्छ , वेब डिजाईनमा, यो प्राप्त गर्ने तरिकाहरू (र यस लेखमा हामीले ढाकिएको तरिका) को एक ब्लककुटो भनिन्छ।
त्यसोभए हामी कसरी ब्लकक्वाट ट्याग को प्रयोग गर्न को लागी लंबी उद्धरणहरु लाई परिभाषित गर्न को लागी को लागी, जस्तै "लेबर्बरवाकी" ले यो लुईस क्यारोल ले यस अंश को उद्धरण गर्दछ:
'Twas brillig र slithey टावरहरू
ग्यारह र भिबामा चिन्ता भयो:
सबै मिठो बोरोजोभ थिए,
र मोम रथ अपग्रेड।
(लुईस क्यारोल द्वारा)
ब्लकक्टेट ट्याग प्रयोग गरिँदै
ब्लकक्टेट ट्याग एक सेमीन्ट ट्याग हो जसले ब्राउजर वा प्रयोगकर्ता एजेन्टरलाई बताउँछ कि सामग्री एक लामो उद्धरण हो। यसैले, तपाइँले पाठलेखन गर्नुभएन जुन ब्लकक्वाट ट्याग भित्र उद्धरण छैन। याद गर्नुहोस्, एक "उद्धरण" प्राय: वास्तविक शब्दहरू हो जसले कसैले भनेका छन् वा बाह्य स्रोतबाट पाठ (जस्तै यो लेखमा लुईस क्यारोल पाठ), तर यो पनि pullquote अवधारणा हुन सक्छ जुन पहिले हामीले कवर गरेको छ।
जब तपाईं यसको बारेमा सोच्नुहुन्छ, कि pullquote पाठको उद्धरण हो, यो केवल त्यहि लेखबाट हुन सक्छ जुन उद्धरण आफैमा देखिन्छ।
प्राय: वेब ब्राउजरले ब्लककोटको दुवै पक्षमा केहि इन्डेन्टिंग (लगभग 5 रिक्त स्थानहरू) जोड्छ जुन यो वरपरको पाठबाट बाहिर निस्किन्छ। केही अत्यन्त पुरानो ब्राउजरले उद्धृत पाठलाई पनि इटालिकमा प्रस्तुत गर्न सक्छ।
याद गर्नुहोस् कि यो केवल blockquote तत्त्वको पूर्वनिर्धारित स्टाइल हो। सीएसएस संग, तपाईंसँग तपाइँको ब्लकक्वाटोट कसरी प्रदर्शित हुनेछ भन्ने बारे कुल नियन्त्रण छ। तपाईं इन्डेन्ट बढाउन वा भित्री रूपमा हटाउन सक्नुहुन्छ, पृष्ठभूमि रंग थप गर्नुहोस् वा उद्धरणलाई थप गर्नको लागि पाठ आकार बढाउनुहोस्। तपाईं त्यो पृष्ठको एक पक्षमा उद्धरण गर्न सक्नुहुन्छ र अर्को पाठ यसको वरपर लुगा लगाउन सक्नुहुन्छ, जुन प्रिन्ट म्यागजिनमा pullquotes को लागि प्रयोग गरिने सामान्य दृश्य शैली हो। तपाइँसँग ब्लकक्वाटको उपस्थितिमा सीएसएसको साथ नियन्त्रण छ, हामी केहि र चाँडै धेरै छलफल गर्नेछौं। अहिलेको लागि, हामी कसरी तपाइँको HTML मार्कअपमा उद्धरण थप्न को लागी हेर्न जारी राखौं।
तपाईंको पाठमा ब्लकक्वाट ट्याग थप्नको लागी, केवल पाठ ट्याग जोडासँग एक उद्धरण पाठ समाधि -
उदाहरणका लागि:
'Twas brillig र slithey टावरहरू
ग्यारह र भिबामा चिन्ता भयो:
सबै मिठो बोरोजोभ थिए,
र मोम रथ अपग्रेड।
तपाईले देख्न सक्नुहुनेछ, तपाइँले उद्धरणको सामग्री वरिपरि ब्लकक्वाट ट्यागको जोडी जोड्न सक्नुहुन्छ। यस उदाहरणमा, हामीले केहि ब्रेक ट्यागहरू पनि प्रयोग गर्यौं (
) एक लाइन ब्रेक जोड्न को लागी जहां उपयुक्त अंदर पाठ। यो किनभने हामी कविताबाट पाठ तयार गर्दैछौं, जहाँ ती विशिष्ट ब्रेकहरू महत्त्वपूर्ण छन्। यदि तपाइँ एक ग्राहक प्रशंसापत्र उद्धरण सिर्जना गरिरहनु भएको थियो, र रेखाहरूलाई विशेष भागहरूमा तोड्न आवश्यक छैन, तपाइँ यी ब्रेक ट्यागहरू थप्न चाहनुहुन्न र ब्राउजरलाई लपेटा र स्क्रिन साइजको आधारमा आवश्यक रूपमा तोक्न अनुमति दिन चाहानुहुन्छ।
इन्डेन्ट पाठमा ब्लकक्वाट प्रयोग नगर्नुहोस्
धेरै वर्षको लागि, मानिसहरूले ब्लकक्वाट ट्याग प्रयोग गरे भने उनीहरूले आफ्नो वेबपेजमा पाठ इन्डेन्ट गर्न चाहन्थे, भले यो पाठ एक पुलक्वाट थिएन। यो एक खराब अभ्यास हो! तपाईं दृश्य कारणहरूको लागि मात्र ब्लकक्वाटको अर्थशास्त्र प्रयोग गर्न चाहानुहुन्छ। यदि तपाईंलाई आफ्नो पाठ इन्डेन्ट गर्न आवश्यक छ भने तपाईले शैली पानाहरू प्रयोग गर्नु हुँदैन, ब्लकक्वाट ट्याग होइन (बेशक, तपाईले इन्डेन्टिन्टलाई के गर्ने प्रयास गर्दै हुनुहुन्छ!)। यो कोड तपाईंको वेब पृष्ठमा राख्ने प्रयास गर्नुहोस् यदि तपाइँ मात्र एक इन्डेन्ट थप्न प्रयास गर्दै हुनुहुन्छ:
यसले इन्डेन्ट गरिएको पाठ हुनेछ।
अर्को, तपाईं त्यो कक्षालाई CSS शैलीसँग लक्षित गर्नुहुन्छ
.indented {
padding: 0 10px;
}
यसले अनुच्छेदको दुवै पक्षमा 10 पिक्सल प्याडिडिङ थप्छ।
जेनिफर क्रिनिन द्वारा मूल लेख। 5/8/17 मा जेरेमी Girard द्वारा संपादित।