HTML Lists Tags Kya Hote Hain?

HTML Lists ka Introduction

HTML lists ka use related items ko group karne ke liye hota hai. Yeh content ko structured, readable, aur organized banata hai. Aapko har list ka purpose samajhna zaroori hai, jisse aap apni website ya page ko acche se organize kar sakein.

HTML me mukhya roop se teen tarah ki lists hoti hain: Unordered List, Ordered List, aur Description List. Chaliye in teeno ko detail me samajhte hain.

1. Unordered Lists (<ul>)

Unordered list wo hoti hai jisme items ka order important nahi hota. Yeh aamtaur par bullet points ke saath dikhai jaati hai. Har list item ko <li> (list item) tag ke andar likha jaata hai.

Example:

<ul>
  <li>Apple</li>
  <li>Banana</li>
  <li>Grapes</li>
</ul>

Aap CSS ki list-style-type property ka use karke bullet ka style badal sakte hain, jaise circle, square, ya none.

2. Ordered Lists (<ol>)

Ordered list wo hoti hai jisme items ka sequence important hota hai, jaise steps in a recipe ya rankings. Yeh aamtaur par numbers (1, 2, 3...) ke saath aati hai.

Example:

<ol>
  <li>Pehle login karein</li>
  <li>Apna profile update karein</li>
  <li>Logout karein</li>
</ol>

List Types

Aap type attribute ka use karke numbering style badal sakte hain:

• type="1": Numbers (default)
• type="A": Uppercase letters
• type="a": Lowercase letters
• type="I": Uppercase Roman numerals
• type="i": Lowercase Roman numerals

<ol type="a">
  ...
</ol>

3. Description Lists (<dl>)

HTML me Description List ka use tab hota hai jab hume terms aur unke descriptions ko dikhana ho, jaise glossary ya dictionary.

Description List ke Tags:

• <dl> (Description List): Puri list ko wrap karta hai.
• <dt> (Description Term): Term ya title ko define karta hai.
• <dd> (Description Definition): Term ka description provide karta hai.

Example:

<dl>
  <dt>HTML</dt>
  <dd>HyperText Markup Language, jo web pages banane ke liye use hota hai.</dd>

  <dt>CSS</dt>
  <dd>Cascading Style Sheets, jo web pages ko style karne me madad karta hai.</dd>
</dl>

Nested Lists (Ek List ke Andar Doosri List)

Nested Lists ka matlab hota hai list ke andar ek aur list. HTML me aap kisi bhi <li> element ke andar ek nayi <ul> ya <ol> list shuru karke nested lists bana sakte hain.

<ul>
  <li>Programming Languages
    <ol>
      <li>Python</li>
      <li>Java</li>
      <li>JavaScript</li>
    </ol>
  </li>
  <li>Web Technologies
    <ul>
      <li>HTML</li>
      <li>CSS</li>
      <li>React.js</li>
    </ul>
  </li>
</ul>

Key Takeaways

• <ul> ka use karein jab items ka order important na ho.
• <ol> ka use karein jab items ka sequence important ho.
• <dl> ka use term/definition pairs ke liye karein.
• Har list item ko <li> tag ke andar rakhein.
• Aap lists ko ek doosre ke andar nest kar sakte hain.