HTML  list is a way to organize and present items in a structured manner. There are three main types of lists in HTML:

  1. Ordered List
  2. Unordered List
  3. Definition List

1. Ordered List (<ol>):

An ordered list is a numbered list where the order of items is important. Each item is wrapped in an <li> (list item) element. Here's an example:

<ol>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ol>

 

The above code will display an ordered list as follows:

  1. First item

  2. Second item

  3. Third item

2. Unordered List (<ul>):

An unordered list is a bulleted list where the order of items is not important. Like the ordered list, each item is contained within an <li> element. Here's an example:

<ul>
  <li>Red</li>
  <li>Green</li>
  <li>Blue</li>
</ul>

 

The above code will display an unordered list with bullet points:

  • Red
  • Green
  • Blue

3. Definition List (<dl>):

A definition list consists of a series of terms (<dt>) and their corresponding definitions (<dd>). It is commonly used to present glossaries, definitions, or a set of name-value pairs. Here's an example:

<dl>
  <dt>HTML</dt>
  <dd>Hypertext Markup Language</dd>
  <dt>CSS</dt>
  <dd>Cascading Style Sheets</dd>
</dl>

 

The above code will display a definition list as follows: HTML

  • Hypertext Markup Language CSS
  • Cascading Style Sheets

These are the basic structures for creating lists in HTML. Lists can be nested within each other to create more complex structures. Additionally, you can apply CSS styles to lists to customize their appearance, such as changing the bullet points or numbers, adding padding, or changing the font size.

Lists are widely used in web development to present information in an organized and hierarchical manner. They are useful for navigation menus, bullet-pointed content, glossaries, and more.

Latest Tutorial

Newly published tutorials

Laravel - How to upload file to AWS S3 Bucket

Explore how we can upload file using the laravel on Amazon S3 bucket.

How to Make an AWS S3 Bucket Public

Learn how we can make an AWS S3 bucket public

Laravel 10 - Tutorial on how to use jQuery to validate the form

Learn how to use jQuery in Laravel 10 to validate the form