HTML Paragraph: p Tag, br और pre का इस्तेमाल
3 मिनट पढ़ें · मुफ़्त · बिना लॉगिन
<p> tag एक paragraph को परिभाषित करता है। Browsers हर paragraph के पहले और बाद में अपने आप एक खाली line जोड़ देते हैं, इसलिए आपका text बिना आपकी मदद के पढ़ने योग्य रहता है।
Spaces और new lines गायब हो जाते हैं
यह हर शुरुआती को हैरान करता है: HTML में, आपके code में अतिरिक्त spaces और line breaks को नज़रअंदाज़ कर दिया जाता है। अगर आप दस spaces टाइप करते हैं, तो browser एक दिखाता है। अगर आप तीन बार Enter दबाते हैं, तो browser कोई line break नहीं दिखाता। Browser को सिर्फ tags की परवाह होती है, न कि आपने source code को कैसे format किया है।
याद रखने की तरकीब: Space दस टाइप करो, दिखेगा एक — Enter कितनी भी बार दबाओ, layout सिर्फ tag बदलता है।
लाइन ब्रेक — br tag
जब आप नया paragraph शुरू किए बिना line break चाहते हैं — उदाहरण के लिए, किसी पते या कविता में — तो <br> इस्तेमाल करें। यह एक empty element है, इसलिए इसका कोई closing tag नहीं होता।
प्रीफ़ॉर्मेटेड टेक्स्ट — pre tag
कभी-कभी आप चाहते हैं कि browser आपके spaces और line breaks को बिल्कुल वैसे ही रखे जैसे आपने टाइप किए थे — उदाहरण के लिए, code के एक टुकड़े में। <pre> tag यही करता है। उसके अंदर की हर चीज़ fixed-width font में, बिल्कुल वैसे ही दिखती है जैसे आपने लिखी थी।
<br> tags एक के बाद एक इस्तेमाल न करें। नया <p> इस्तेमाल करें और spacing को CSS से नियंत्रित करने दें — यह साफ है और बाद में बदलना आसान है।Paragraph क्या है
Paragraph, <p>, एक विचार के बारे में text का एक block है। Browsers हर paragraph के पहले और बाद में अपने आप थोड़ी जगह जोड़ देते हैं, इसलिए दो paragraphs हमेशा एक खाली line से अलग होते हैं। पेज ज़्यादातर paragraphs से ही बना होता है — वे HTML में सबसे ज़्यादा इस्तेमाल होने वाले element हैं।
Text के लिए उपयोगी tags
| Tag | Value | विवरण |
|---|---|---|
<p> | text | एक सामान्य paragraph। |
<br> | — | Paragraph के अंदर एक line break। इसका कोई end tag नहीं होता। |
<hr> | — | एक horizontal line जो एक विषय को दूसरे से अलग करती है। |
<pre> | text | Preformatted text — spaces और line breaks बिल्कुल वैसे ही रखे जाते हैं जैसे टाइप किए गए थे। |
इन दोनों की तुलना करें। पहले में, अतिरिक्त spaces और line breaks गायब हो जाते हैं। दूसरे में, <pre> हर चीज़ को बिल्कुल वैसे ही रखता है जैसे आपने टाइप किया था:
<p>Hello world. This is one line.</p> <pre>Hello world. This is one line.</pre>
<br> पाँच बार न दबाएँ। इसके बजाय CSS spacing इस्तेमाल करें, जैसे style="margin-bottom: 20px;"। यह साफ है और बाद में बदलना बहुत आसान है।आम गलतियाँ
- पूरे पेज को एक विशाल paragraph में डालना — एक विचार, एक paragraph।
- Sections के बीच जगह बनाने के लिए
<br><br><br>इस्तेमाल करना — यह CSS margins का काम है। - Heading, list या table को
<p>के अंदर डालना — paragraphs में सिर्फ text और inline elements हो सकते हैं। - सामान्य text के लिए
<pre>इस्तेमाल करना — यह fixed-width font इस्तेमाल करता है और code के लिए है, लेखों के लिए नहीं।
उदाहरण
<!DOCTYPE html>
<html>
<head>
<title>Paragraphs</title>
</head>
<body>
<p>This is a paragraph. Browsers add space
around it automatically.</p>
<p>First line<br>Second line</p>
<pre>
Line one
Line two (spaces kept)
Line three
</pre>
</body>
</html>परिणाम
खुद करके देखें — लाइव एडिटर
नीचे दिया गया कोड बदलें और चलाएँ दबाएँ — परिणाम तुरंत दिखेगा। कोई फाइल सहेजनी नहीं है, कोई लॉगिन नहीं चाहिए।
संबंधित पाठ
अक्सर पूछे जाने वाले सवाल
इस पाठ के बारे में सबसे ज़्यादा पूछे जाने वाले सवाल — सवाल पढ़ें, फिर खोलकर जवाब देखें।
1. p टैग किस काम आता है?
p टैग एक पैराग्राफ़ बनाता है। ब्राउज़र हर पैराग्राफ़ के पहले और बाद में अपने आप खाली लाइन जोड़ देता है।
2. मेरे ज़्यादा स्पेस और नई लाइनें क्यों गायब हो जाती हैं?
ब्राउज़र सामान्य टेक्स्ट में ज़्यादा स्पेस, टैब और नई लाइनों को एक ही स्पेस में बदल देता है। लेआउट सिर्फ़ टैग से बदलता है।
3. स्पेस और लाइन ब्रेक बिल्कुल जैसे लिखे हैं, वैसे कैसे दिखाएँ?
pre टैग इस्तेमाल करें। इसके अंदर सब कुछ फ़िक्स्ड-विड्थ फ़ॉन्ट में, बिल्कुल जैसा लिखा है वैसा ही दिखता है।
खुद क्यों सीखें — AI से पूछने के बजाय?
AI आपके लिए कोड लिख सकता है, लेकिन वह आपके लिए सोच नहीं सकता। जब आप HTML खुद सीखते हैं, तो आपका दिमाग असली कौशल बनाता है: आप समझते हैं कि पेज ऐसा क्यों दिखता है, टूटने पर उसे ठीक कर सकते हैं, और परीक्षा या इंटरव्यू में बिना मदद के जवाब दे सकते हैं। यही कौशल नौकरी दिलाता है — कॉपी किया हुआ जवाब नहीं।
सर्टिफिकेट पाएँ — सिर्फ ₹10
सभी 35 पाठ पूरे करें, टेस्ट पास करें (80%), ₹10 दें और अपना सर्टिफिकेट पाएँ।
टेस्ट देंदेखकर सीखना पसंद है? वीडियो कोर्स में वही विषय एक-एक करके सिखाए जाते हैं।
Go further with a full course
Free tutorials teach you the basics. Our paid courses add live projects, mentorship and a certificate.
Browse all courses
