/    /  HTML Lists

HTML Lists

 

HTML Lists are used to provide lists of information in a well-formed and semantic way. There are three different types of HTML lists:

  1. Unordered list
  2. Ordered list
  3. Description list

 

Unordered Lists:

 

An unordered list created using the <ul> element, and each list item starts with the <li> element. all the Unordered list items are marked with bullets.

 

Example:

 

<h2>HTML Unordered List</h2>
     <ul>
   <li>i2tutorials</li>
   <li>i2tutorials11</li>
   <li>i2tutorials22</li>
  </ul>

 

OUTPUT:

 

HTML Lists

 

HTML Nested Unordered List:

 

Example:

 

<h2>HTML Nested Unordered List</h2>
 <ul>
   <li>I2 Tutorials
      <ul>
        <li>HTML5</li>
        <li>CSS</li>
      </ul>
   </li>
   <li>Bootstrap4</li>
   <li>Javascript</li>
 </ul>

 

OUTPUT:

 

HTML Lists

 

2. HTML Ordered Lists:

 

An each ordered list starts using the <ol> tag, and each list item starts with the <li> element. Ordered lists are used a numbered lists also.

 

Example:

 

<h2>HTML Ordered List</h2>
      <ol>
   <li>I2 Tutorials</li>
   <li>I2 Tutorials - 11</li>
   <li>I2 Tutorials - 22</li>
  </ol>

 

OUTPUT:

 

 

HTML Nested Ordered List:

 

Example:

 

<h2>HTML Nested Ordered List</h2>
  <ol>
    <li>I2 - Tutorials</li>
    <li>HTML5</li>
    <li>CSS3
       <ol>
         <li>BOOTSTRAP4</li>
         <li>JAVASCRIPT</li>
       </ol>
    </li>
  </ol>

 

OUTPUT:

 

HTML Lists

 

3. HTML Description Lists:

 

The description list is starts with the <dl> element. The <dl> element is used in conjunction with the <dt> element which provides a term, and the <dd> element which specify the term’s definition.

 

Example:

 

<h2>HTML Definition List</h2>
      <dl>
    <dt>I2 Tutorials</dt>
    <dd>HTML5</dd>
    <dt>CSS3</dt>
    <dd>JAVASCRIPT</dd>
  </dl>

 

OUTPUT:

 

HTML Lists