HTML Lists
HTML lists are used to group and present items in a structured manner on a webpage. There are three primary types of HTML lists: unordered lists, ordered lists, and description lists. Here’s an overview of each type:
Unordered Lists
Purpose: Used for items where the order does not matter. Typically, unordered lists are displayed with bullet points.
Tag Structure:
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Explanation:
<ul>
: Stands for "unordered list". It is the container element for the list.<li>
: Stands for "list item". Each<li>
represents an item in the list.
Example:
- Apples
- Oranges
- Bananas
3. Description Lists
Purpose: Used for listing terms and their descriptions. This type of list is useful for glossaries, definitions, or FAQs.
Tag Structure:
<dl>
<dt>Term 1</dt>
<dd>Description of term 1.</dd>
<dt>Term 2</dt>
<dd>Description of term 2.</dd>
</dl>
Explanation:
<dl>
: Stands for "description list". It is the container element for the list.<dt>
: Stands for "description term". It represents the term or name being described.<dd>
: Stands for "description definition". It provides the description or definition of the term.
Example:
- HTML
- HyperText Markup Language, the standard language for creating web pages.
- CSS
- Cascading Style Sheets, used for styling and layout of web pages.
Nested Lists
Lists can be nested inside one another to create hierarchical structures:
- Fruit
- Apples
- Oranges
- Vegetables
- Carrots
- Broccoli