HTML Page Formatting क्या है?
HTML page formatting
HTML में Page Formatting का मतलब webpage के content को इस तरह structure और format करना है कि text user को साफ और व्यवस्थित तरीके से दिखाई दे। इसमें paragraphs बनाना, line break देना, extra spacing दिखाना, text को bold या italic करना और page के background को बदलना जैसी चीजें शामिल हो सकती हैं।
HTML में कुछ tags content की meaning और structure को define करते हैं, जबकि visual appearance के लिए CSS का उपयोग किया जाता है। उदाहरण के लिए text को important दिखाने के लिए <strong> और emphasis के लिए <em> जैसे HTML elements उपयोग किए जा सकते हैं, जबकि color, background, font-size और alignment जैसी styling के लिए CSS ज्यादा उचित है।
Adding a New Paragraph
HTML में नया paragraph बनाने के लिए <p> tag का इस्तेमाल किया जाता है। Paragraph के content को <p> और </p> के बीच लिखा जाता है। Browser सामान्यतः प्रत्येक paragraph को अलग block के रूप में display करता है।
उदाहरण के लिए नीचे दो अलग-अलग paragraphs बनाए गए हैं:
हर <p> element एक नया paragraph बनाता है। Browser paragraphs के बीच सामान्यतः कुछ default spacing भी दिखाता है। इस spacing को CSS के द्वारा customize किया जा सकता है।
Adding a Line Break
अगर आपको एक ही paragraph या text के अंदर किसी particular जगह से अगली line शुरू करनी है, तो <br> tag का उपयोग किया जाता है। यह एक void element है, इसलिए इसका अलग closing tag नहीं होता।
उदाहरण:
<br> केवल line break देता है। अगर आपके पास अलग-अलग paragraphs हैं, तो paragraph के लिए <p> का उपयोग करना ज्यादा appropriate होता है।
Inserting Extra Space
HTML में सामान्य text के बीच कई consecutive spaces लिखने पर browser उन्हें सामान्यतः एक visible space के रूप में collapse कर देता है। अगर किसी specific जगह पर non-breaking space की जरूरत हो, तो character entity का उपयोग किया जा सकता है।
उदाहरण:
एक non-breaking space represent करता है। इसका उपयोग जरूरत के अनुसार text के बीच extra space या ऐसे space के लिए किया जा सकता है जिसे browser सामान्य whitespace collapsing में हटाए नहीं। हालांकि page layout बनाने के लिए बहुत सारे लगाने के बजाय CSS का उपयोग करना बेहतर तरीका है।
Bold और Important Text
HTML में text को important दिखाने के लिए <strong> tag का उपयोग किया जा सकता है। Browser इसे सामान्यतः bold text के रूप में दिखाता है और यह semantic importance भी बताता है।
सिर्फ visual bold appearance के लिए <b> tag का उपयोग किया जा सकता है।
Italic और Emphasized Text
Text पर emphasis दिखाने के लिए <em> tag का उपयोग किया जा सकता है। Browser इसे सामान्यतः italic style में दिखाता है। वहीं <i> tag का उपयोग ऐसे text के लिए किया जा सकता है जिसे अलग visual voice या italic appearance में दिखाना हो।
Adding a Horizontal Line
HTML में दो sections या topics के बीच thematic separation दिखाने के लिए <hr> element का उपयोग किया जा सकता है। Browser इसे सामान्यतः एक horizontal line के रूप में दिखाता है।
Changing Page Background
Webpage का background बदलना technically HTML formatting से ज्यादा CSS styling का काम है। Modern websites में background color या background image लगाने के लिए CSS की background-color और background-image properties का उपयोग किया जाता है।
Beginners को concept समझाने के लिए CSS को style attribute के अंदर भी लिखा जा सकता है।
Changing Text Color
HTML में text का color बदलने के लिए भी CSS का उपयोग किया जाता है। Inline example में style attribute के अंदर color property लिखी जा सकती है।
Combining Basic Formatting
अलग-अलग HTML elements को एक ही webpage में combine करके ज्यादा useful content बनाया जा सकता है। नीचे paragraph, bold, italic, line break और horizontal line को एक साथ इस्तेमाल किया गया है।
Complete HTML Page Formatting Example
अब नीचे एक complete example दिया गया है जिसमें इस page पर बताए गए कई basic concepts को एक ही HTML document में use किया गया है। आप इसे अपने editor में run करके इसका output देख सकते हैं।
HTML Page Formatting में उपयोग होने वाले मुख्य Elements
- <p> – Paragraph बनाने के लिए।
- <br> – Line break देने के लिए।
- <strong> – Important text को mark करने के लिए।
- <b> – Text को bold appearance देने के लिए।
- <em> – Text पर emphasis देने के लिए।
- <i> – Italic या अलग visual voice के text के लिए।
- <hr> – Content के बीच thematic separation के लिए।
- – Non-breaking space के लिए।
- style – किसी element पर inline CSS लगाने के लिए।
HTML Formatting में HTML और CSS का संबंध
HTML और CSS का काम अलग-अलग लेकिन connected होता है। HTML मुख्य रूप से webpage के content और structure को define करता है, जबकि CSS उस content की visual presentation को control करता है।
उदाहरण के लिए <p> tag यह बताता है कि content एक paragraph है, जबकि CSS से उस paragraph का color, font-size, margin, line-height और अन्य visual properties बदली जा सकती हैं।
इसलिए modern web development में page को format और design करने के लिए HTML और CSS दोनों का सही combination इस्तेमाल किया जाता है।
निष्कर्ष
HTML Page Formatting को समझना beginners के लिए बहुत जरूरी है। <p> से paragraphs, <br> से line breaks, <strong> और <b> से bold text, <em> और <i> से emphasis या italic text और <hr> से sections के बीच separation बनाया जा सकता है।
वहीं background color, text color, font size और alignment जैसी visual styling के लिए CSS का उपयोग करना बेहतर और modern approach है। HTML structure और CSS styling को साथ में समझने से आप ज्यादा organized और user-friendly webpages बना सकते हैं।
Request
Leave a Comment
INITIALIZING...
INITIALIZING...
Comments Total: 0 comments