HTML में कोई topic मुद्दों के अनुसार और किसी information को list के अनुसार देना हो तो html ordered और unordered list इन tags का इस्तेमाल किया जाता है |

HTML Listing Elements

Listing Elements	Example	Description
<ul>	Unordered List Unordered List Unordered List	ये unordered list होता है | ये list के items के लिए simple bullets का इस्तेमाल करते है |
<ol>	Ordered List Ordered List Ordered List	ये ordered list होता है | ये अलग-अलग numbers अपने list के items के लिए इस्तेमाल करते है |

 

HTML Unordered List

Unordered list की शुरुआत <u> tag से होती है और unordered list का हर एक list item <li> और </li> के अन्दर close होता है | Unordered list के हर item को by default; bullet से निर्देशित किया जाता है |

Source Code :

<ul>
<li>Apple</li>
<li>Orangle</li>
<li>Pineapple</li>
<li>Banana</li>
<li>Strawberry</li>
</ul>

Output :

'type' Attribute for HTML

Attribute's Value	Description
circle	इस value की मदद से हर list item को circle से निर्देशित किया जाता है |
square	इस value की मदद से हर list item को square से निर्देशित किया जाता है |
disc	इस value की मदद से हर list item को disc से निर्देशित किया जाता है | ये by default; unordered list पर स्थित होता है |
none	इस value की मदद से हर list item को निर्देशित नहीं किया जाता है |

 

Example for Unordered List's type Attribute in HTML

Source Code :

<p>circle value</p>
<ul type="circle">
<li>Apple</li>
<li>Orangle</li>
</ul>

<p>square value</p>
<ul type="square">
<li>Apple</li>
<li>Orangle</li>
</ul>

<p>disc value</p>
<ul type="disc">
<li>Apple</li>
<li>Orangle</li>
</ul>

<p>none value</p>
<ul type="none">
<li>Apple</li>
<li>Orangle</li>
</ul>

Output :

Nested Unordered List in HTML

Nested unordered list में unordered list में unordered lists होते है |

Note : 1st nested unordered list का type attribute; default 'circle' set होता है और 1st nested unordered list के 1st nested unordered list का type attribute; default 'square' set होता है |

Source Code :

<ul>
<li>Apple</li>
<li>Orangle</li>
<ul>
<li>Banana</li>
<li>Strawberry</li>
<ul>
<li>Papaya</li>
<li>Pineapple</li>
</ul>
<li>Cherry</li>
</ul>
<li>Mango</li>
</ul>

Output :

HTML Ordered List

Ordered list की शुरुआत <ol> tag से होती है और इसमे हर एक item की शुरुआत <li> tag से होती है |

Source Code :

<ol>
<li>Apple</li>
<li>Orangle</li>
<li>Pineapple</li>
<li>Banana</li>
<li>Strawberry</li>
</ol>

Output :

Ordered List's type Attribute in HTML

Attribute's Value	Description
type="1"	हर list item को number दिया जाता है |
type="a"	हर list item को lowercase alphabet दिया जाता है |
type="A"	हर list item को uppercase alphabet दिया जाता है |
type="i"	हर list item को lowercase roman number दिया जाता है |
type="I"	हर list item को uppercase roman number दिया जाता है |

 

Example for Ordered List's type Attribute in HTML

Source Code :

<p>Default type</p>
<ol>
<li>Apple</li>
<li>Orangle</li>
</ol>

<p>type="1"</p>
<ol type="1">
<li>Apple</li>
<li>Orangle</li>
</ol>

<p>type="a"</p>
<ol type="a">
<li>Apple</li>
<li>Orangle</li>
</ol>

<p>type="A"</p>
<ol type="A">
<li>Apple</li>
<li>Orangle</li>
</ol>

<p>type="i"</p>
<ol type="i">
<li>Apple</li>
<li>Orangle</li>
</ol>

<p>type="I"</p>
<ol type="I">
<li>Apple</li>
<li>Orangle</li>
</ol>

Output :

Nested Ordered List in HTML

Nested Ordered list में Ordered list में Ordered lists होते है |

Source Code :

<ol>
<li>Apple</li>
<li>Orangle</li>
<ol>
<li>Banana</li>
<li>Strawberry</li>
<ol>
<li>Papaya</li>
<li>Pineapple</li>
</ol>
<li>Cherry</li>
</ol>
<li>Mango</li>
</ol>

Output :