HTML Text Formatting Tags Kya Hote Hain?

Apne Text ko Visually Attractive aur Semantically Meaningful Banana Sikhein

Text Formatting ka Introduction

HTML me text formatting tags ka use text ko alag-alag tarike se display karne ke liye hota hai—jaise bold, italic, ya underlined. Yeh tags na sirf text ko visually appealing banate hain, balki kuch tags search engines aur screen readers ko content ka "meaning" bhi batate hain.

Chaliye, sabse common text formatting tags aur unke beech ke antar ko samjhein.

1. Bold vs. Strong: Text ko Mota Karna

HTML me text ko bold karne ke liye <b> aur <strong> dono tags use hote hain, lekin inka purpose alag hai.

  • <b> (Bold): Yeh tag sirf text ko visually bold karta hai. Iska koi extra semantic meaning nahi hota.
  • <strong>: Yeh tag text ko bold karne ke saath-saath uski importance (semantic meaning) ko bhi batata hai. Screen readers is text par zyada zor de sakte hain. SEO ke liye yeh behtar hai.
<p>This is a <b>bold</b> text.</p>
<p>This is a <strong>important</strong> text.</p>

This is a bold text.

This is a important text.

2. Italic vs. Emphasized: Text ko Tircha Karna

Bold ki tarah hi, text ko italic (tircha) karne ke liye bhi do tags hain: <i> aur <em>.

  • <i> (Italic): Yeh tag text ko sirf visually italic karta hai. Iska use technical terms, names, ya phrases ke liye hota hai.
  • <em> (Emphasized): Yeh tag text ko italic karne ke saath-saath us par emphasis (zor) dalta hai. Yeh sentence ke meaning ko badal sakta hai.
<p>Yeh ek <i>italic</i> text hai.</p>
<p>Yeh ek <em>emphasized</em> text hai.</p>

Yeh ek italic text hai.

Yeh ek emphasized text hai.

3. Underline, Inserted, aur Highlighted Text

  • <u> (Underline): Text ko underline karta hai. Iska use kam karein kyunki users ise link samajh sakte hain.
  • <ins> (Inserted): Yeh batata hai ki text document me baad me add kiya gaya hai. Yeh bhi underline dikhta hai.
  • <mark> (Marked/Highlighted): Text ko highlight karta hai, jaise marker se kiya gaya ho. Yeh search results me keywords highlight karne ke liye useful hai.
<p>This is <u>underlined</u>, <ins>inserted</ins>, and <mark>highlighted</mark> text.</p>

This is underlined, inserted, and highlighted text.

4. Deleted aur Strikethrough Text

  • <s> (Strikethrough): Batata hai ki text ab relevant ya accurate nahi hai.
  • <del> (Deleted): Batata hai ki text document se remove kar diya gaya hai.
<p>Price: <s>₹500</s> <ins>₹300</ins></p>
<p>The event is on <del>15th</del> <ins>20th</ins> August.</p>

Price: ₹500 ₹300

The event is on 15th 20th August.

5. Subscript aur Superscript Text

  • <sub> (Subscript): Text ko normal line se thoda neeche dikhata hai. Jaise chemical formulas (H₂O).
  • <sup> (Superscript): Text ko normal line se thoda upar dikhata hai. Jaise mathematical exponents (x²).
<p>Water: H<sub>2</sub>O</p>
<p>Math: E = mc<sup>2</sup></p>

Water: H2O

Math: E = mc2

Key Takeaways

  • Styling ke liye CSS ka use karna best practice hai, lekin in tags ka apna semantic importance hai.
  • Jahan zaroori ho, semantic tags (<strong>, <em>, <del>) ko visual tags (<b>, <i>, <s>) par prefer karein.
  • <mark> relevance dikhane ke liye use hota hai.
  • <sub> aur <sup> scientific aur mathematical notations ke liye perfect hain.
Bonus: Practical Application!
Apne webpage par aaj hi text formatting ka use karke dekhein!

Ek paragraph likhein aur usme <strong>, <em>, aur <mark> tags ka use karke important parts ko highlight karein.

Practice in HTML Editor
Test Your Knowledge!
Kya aap Text Formatting Tags ke baare mein seekh chuke hain? Chaliye dekhte hain!

Apni knowledge test karne ke liye is quick quiz ko dein.

Start Quiz