एकाधिक नॉन-ब्रेकिंग स्पेस के बजाय टैब स्पेस (“ ”)?

Ekadhika Nona Brekinga Spesa Ke Bajaya Taiba Spesa Nbsp



वेब विकास में, HTML दस्तावेज़ों में 'का उपयोग करके रिक्त स्थान जोड़े जाते हैं'   'एंटिटी कोड जिसे नॉन-ब्रेकिंग स्पेस भी कहा जाता है। कुछ मामलों में, दस्तावेज़ में कई नॉन-ब्रेकिंग स्पेस जोड़ने की आवश्यकता होती है, जैसे टैब स्पेस। इसलिए, एकाधिक ' ' इकाई कोड दस्तावेज़ के कोड अनुक्रम और साफ-सफाई को प्रभावित कर सकते हैं।

इन मुद्दों से निपटने के लिए, HTML दस्तावेज़ में कई गैर-ब्रेकिंग स्पेस शामिल करने के कई अन्य तरीके हैं, जैसे ' <पूर्व> ”, “ <विस्तार> 'तत्व, सीएसएस' मार्जिन छोड़ दिया ”, “ गद्दी छूट गई ” गुण, और बहुत कुछ।

यह अध्ययन आपको सिखाएगा:







सबसे पहले, हम एक उदाहरण के माध्यम से चलेंगे जो 'लागू करता है'   ” HTML दस्तावेज़ में रिक्त स्थान जोड़ने के लिए। फिर, टैब स्पेस जोड़ने के लिए अलग-अलग तरीकों को प्रदर्शित करने के लिए धीरे-धीरे दृष्टांत देखें।



“ ” का उपयोग करके स्पेस कैसे जोड़ें एचटीएमएल में इकाई कोड?

'का उपयोग करके रिक्त स्थान जोड़ने के लिए   ” HTML पृष्ठ पर, दिए गए चरणों का पालन करें:



  • एक div तत्व जोड़ें और इसे एक वर्ग असाइन करें ' लेख ”।
  • उसके बाद, एक 'रखें <एच2> शीर्षक के लिए तत्व।
  • फिर, 'जोड़ें'

    ” एक पैराग्राफ जोड़ने के लिए तत्व। पैराग्राफ की शुरुआत में, इकाई कोड इंगित करके रिक्त स्थान जोड़े जाते हैं '   ':

< डिव कक्षा = 'लेख' >
< एच 2 > ज्ञान शक्ति है < / एच 2 >
< पी >     नॉलेज इज पावर का अर्थ है कि एक शिक्षित व्यक्ति का ज्ञान के बल पर अपने जीवन पर पूर्ण नियंत्रण होता है। < / पी >
< / डिव >

यह देखा जा सकता है कि पैराग्राफ की शुरुआत में रिक्त स्थान सफलतापूर्वक जोड़े गए हैं:





HTML “” Element का उपयोग करके Tab Space कैसे Add करें?

एचटीएमएल ' <विस्तार> ” एक इनलाइन तत्व है जिसका उपयोग दस्तावेज़ के एक हिस्से को चिह्नित करने के लिए किया जाता है। चल रहे उदाहरण में, हमने तत्व को “के साथ जोड़ा है टैब ' पहचान। इस तत्व को सीएसएस में जगह बनाने के लिए स्टाइल किया गया है:



< डिव कक्षा = 'लेख' >
< एच 2 >ज्ञान शक्ति है< / एच 2 >
< पी > < अवधि पहचान = 'टैब' < / अवधि > ज्ञान शक्ति है इसका अर्थ है कि एक शिक्षित व्यक्ति का ज्ञान के माध्यम से अपने जीवन पर पूर्ण नियंत्रण होता है की ताकत।


शैली 'लेख' div

।लेख {
मार्जिन: ऑटो;
चौड़ाई : 400 पीएक्स;
पैडिंग: 10 पीएक्स;
}

' ।लेख 'का उपयोग' तक पहुँचने के लिए किया जाता है <दिव> ” टैग, जो तब निम्नलिखित गुणों के साथ लागू किया जाता है:

  • ' चौड़ाई ' संपत्ति तत्व की चौड़ाई निर्धारित करती है।
  • ' अंतर ' संपत्ति तत्व की ऊंचाई निर्धारित करती है।
  • ' गद्दी 'तत्व की सामग्री के चारों ओर स्थान उत्पन्न करता है।

शैली 'टैब' आईडी

#टैब {
पैडिंग-लेफ्ट: 8px;
}

' #टैब ' तक पहुंच ' टैब तत्व की आईडी और 'लागू करें' गद्दी छूट गई ” उस पर संपत्ति।

उत्पादन

HTML “
” Element का उपयोग करके Tab Space कैसे Add करें?

' <पूर्व> ”तत्व पूर्व-स्वरूपित पाठ को परिभाषित करता है।

 तत्व के भीतर का टेक्स्ट वेब पेज पर जैसा है वैसा ही प्रदर्शित होता है।

पहले HTML पृष्ठ बनाकर उदाहरण का अवलोकन करें:

  • जोड़ें ' <एच2> ”तत्व दस्तावेज़ में स्तर दो का शीर्षक सेट करने के लिए।
  • फिर, 'जोड़ें' <पूर्व> ” टैग करें, और वांछित स्वरूपण के साथ सामग्री निर्दिष्ट करें:
< एच 2 >एचटीएमएल प्री टैग< / एच 2 >
< पूर्व >
समारोह उत्पाद समारोह ( पी 1, पी 2 ) {
वापसी पी 1 * पी 2;
}
< / पूर्व >

उत्पादन

सीएसएस 'मार्जिन-लेफ्ट' संपत्ति का उपयोग करके टैब स्पेस कैसे जोड़ें?

CSS का उपयोग करके टैब स्पेस जोड़ने के लिए ' मार्जिन छोड़ दिया ” संपत्ति, प्रदान की गई प्रक्रिया का पालन करें:

  • सबसे पहले, दस्तावेज़ में एक दिव्य तत्व शामिल करें और इसे एक वर्ग असाइन करें ' इमेजिस ”।
  • इस div तत्व के अंदर, वर्ग के साथ अन्य दो div तत्व जोड़ें ' आईएमजी-1 ' और ' आईएमजी-2 ' क्रमश।
  • इन दो दिव्य तत्वों में से प्रत्येक में ऐसी छवियां हैं जो 'का उपयोग करके निर्दिष्ट की गई हैं' ' टैग।
  • इन ' 'टैग' से संबद्ध हैं स्रोत ' और ' चौड़ाई ' गुण। 'Src' विशेषता छवि का URL निर्दिष्ट करती है, और 'चौड़ाई' विशेषता छवि की चौड़ाई समायोजित करती है।

यहाँ ऊपर चर्चा किए गए परिदृश्य का HTML कोड है:

< डिव कक्षा = 'इमेजिस' >
< डिव कक्षा = 'आईएमजी-1' >
< आईएमजी स्रोत = '/spring-images/marguerite-flower.jpg' चौड़ाई = '250' >
< / डिव >
< डिव कक्षा = 'आईएमजी-2' >
< आईएमजी स्रोत = '/spring-images/flower-ga8f105f1d_1920.jpg' चौड़ाई = '250' >
< / डिव >
< / डिव >

HTML पेज इस तरह दिखेगा:

आइए 'में कई रिक्त स्थान जोड़ने के लिए CSS अनुभाग की ओर बढ़ते हैं' आईएमजी-2 ” कई नॉन-ब्रेकिंग स्पेस का उपयोग किए बिना क्लास।

शैली 'छवियाँ' div

।इमेजिस {
चौड़ाई : 500पीएक्स;
मार्जिन: ऑटो;
}

' ।इमेजिस ” का उपयोग HTML div तक पहुँचने के लिए किया जाता है जिसमें “ इमेजिस ' कक्षा। उपर्युक्त गुणों की व्याख्या इस प्रकार है:

  • ' चौड़ाई ' संपत्ति तत्व की चौड़ाई निर्धारित करती है।
  • ' अंतर ” गुण तत्व के चारों ओर के स्थान को निर्धारित करता है।

शैली 'आईएमजी-2' डिव
'का उपयोग करके div तत्व तक पहुँचें .आईएमजी-2 ':

आईएमजी- 2 {
मार्जिन-लेफ्ट: 30px;
}

' मार्जिन छोड़ दिया 'के साथ संपत्ति' 30 पीएक्स “मूल्य वर्ग वाले HTML div तत्व पर लागू होता है” आईएमजी-2 ”। यह संपत्ति तत्व के बाईं ओर 30px स्थान जोड़ेगी।

यहां, परिणाम दिखाता है कि दूसरी छवि प्रारंभ में कुछ जगह के साथ लागू होती है:

हमने कई नॉन-ब्रेकिंग स्पेस का उपयोग करने के बजाय टैब स्पेस जोड़ने पर विस्तार से बताया है ”   ”।

निष्कर्ष

एचटीएमएल में, '   “एंटिटी कोड का उपयोग आमतौर पर दस्तावेज़ में नॉन-ब्रेकिंग स्पेस जोड़ने के लिए किया जाता है। इस इकाई कोड का कई बार उपयोग करने से बचने के लिए, दस्तावेज़ में टैब स्थान जोड़ने के अन्य तरीके हैं। इन विधियों में HTML का उपयोग शामिल है ” <पूर्व> ”, “ <विस्तार> 'तत्व,' मार्जिन छोड़ दिया ” संपत्ति, और बहुत कुछ। इस ब्लॉग में कई तरीकों का उल्लेख किया गया है जो एकाधिक ' ' जोड़ने के बजाय HTML दस्तावेज़ में टैब रिक्त स्थान जोड़ने में मदद करते हैं। इकाई कोड।