HTML List Elements

HTML list elements are used to express a group of related data within the list. It is categorized into three parts.

  1. Unordered list
  2. Ordered List
  3. Description list
An unordered list starts with the <ul> tag and end with closing with </ul> tag while as each list item exit within <li> tag.

Unordered list -

An unordered list starts with the <ul> tag and end with closing with </ul> tag while as each list item exit within <li> tag.Unordered List item displays on the screen with a bullet by default.

Source Code

          <ul>
  <li>Cricket</li>
  <li>Footbal</li>
  <li>Hockey</li>
</ul>
        
Try it now

It is used to display a group of related data without order.

Ordered List -

An ordered list displays group of related data in a specific order.

Ordered list starts with starting <ol> tag while as end with closing </ol> tag while as list item starts with starting <li> tag and close with </li> tag.Ordered list item displays on the screen with a numeric order by default.

Source Code

          <ol>
  <li>Cricket</li>
  <li>Footbal</li>
  <li>Hockey</li>
</ol>
        
Try it now

Note - Please keep in mind that the unordered list container is denoted by <ul> while the ordered list container is denoted by <ol>.

HTML Description List

HTML description list mainly consists of three tag namely <dl> tag that defines the description list,the <dt> tag shows the term while <dd> tag shows each term.

Source Code

          <h1>HTML Description List</h1>
<dl>
  <dt>Biscuit</dt>
  <dd>A food made of flour.</dd>
  <dt>Coffee</dt>
  <dd>A drink made from roasted coffee beans.</dd>
</dl>
        
Try it now

Online Test / Quiz

Web Tutorials

HTML List Elements
Html Tutorial HTML
Javascript Tutorial JAVASCRIPT
Css Tutorial CSS
Bootstrap 5 Tutorial BOOTSTRAP 5
Bootstrap 4 Tutorial BOOTSTRAP 4