Lists in HTML
Lists in HTML are used to display information in a structured and easy-to-read format. They help in organizing data like items, steps, or points in a web page.
There are mainly 3 types of lists in HTML:
- Ordered List (
<ol>) → Numbered list - Unordered List (
<ul>) → Bulleted list - Definition List (
<dl>,<dt>,<dd>) → Term and description list
Also, we can use Nested Lists (a list inside another list).
Ordered List (<ol>)
An ordered list is used when the order of items is important, like steps or instructions.
- Uses numbers (1, 2, 3 …) by default.
- Each item is written inside the
<li>tag.
Example:
<h3>Steps to Make Tea</h3>
<ol>
<li>Boil water</li>
<li>Add tea leaves</li>
<li>Pour milk and sugar</li>
<li>Stir and serve</li>
</ol>Output :
Notes : -
? Attributes:
type→ Change numbering style (1,A,a,I,i).start→ Start list with a specific number.
Example with attributes:
<ol type="A" start="3">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ol>
Output :
Unordered List (<ul>)
An unordered list is used when the order of items does not matter.
- It shows items with bullets (•) by default.
- Each item is written inside the
<li>tag.
Example:
<h3>Web Development Languages</h3>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>Python</li>
</ul>
Output :
Notes : -
? Attribute:
type→ Changes bullet style (disc,circle,square).
Example:
<ul type="square">
<li>Apple</li>
<li>Mango</li>
<li>Banana</li>
</ul>Output :
