HTML Tutorial - HTML Lists


The Lists can be Unordered, Ordered and Description. Each of them is shown below with an example.

HTML Unordered List


This Unordered list usually lists a collection of items that is not having any sequence. Here the <ul> tag is used.

HTML Example for Unordered List

Source: Result:



HTML Ordered List


This Ordered list a collection of items that is sequencially numbered. Here the <ol> tag is used.

HTML Example for Ordered List

Source: Result:



HTML Description List


This is a definition lists, where each term in the list is breifly explained. Here the <dl> tag is used along with <dt> and <dd> tags.

HTML Example for Description List

Source: Result:



Using the "type" attribute in Unordered List


When "type" attribute is "square"
 <ul type="square">
    <li>Shirts</li>
    <li>Pants</li>
    <li>Tshirt</li>
    <li>Trousers</li>
 </ul>
  • Shirts
  • Pants
  • Tshirt
  • Trousers


When "type" attribute is "disc"
 <ul type="disc">
    <li>Shirts</li>
    <li>Pants</li>
    <li>Tshirt</li>
    <li>Trousers</li>
 </ul>
  • Shirts
  • Pants
  • Tshirt
  • Trousers


When "type" attribute is "circle"
 <ul type="circle">
    <li>Shirts</li>
    <li>Pants</li>
    <li>Tshirt</li>
    <li>Trousers</li>
 </ul>
  • Shirts
  • Pants
  • Tshirt
  • Trousers


Using the "type" attribute in Ordered List


When "type" attribute is "i"
 <ol type="i">
    <li>Book</li>
    <li>Pen</li>
    <li>Pencil</li>
    <li>Rubber</li>
 </ol>
  1. Book
  2. Pen
  3. Pencil
  4. Rubber


When "type" attribute is "1"
 <ol type="1">
    <li>Book</li>
    <li>Pen</li>
    <li>Pencil</li>
    <li>Rubber</li>
 </ol>
  1. Book
  2. Pen
  3. Pencil
  4. Rubber


When "type" attribute is "a"
 <ol type="a">
    <li>Book</li>
    <li>Pen</li>
    <li>Pencil</li>
    <li>Rubber</li>
 </ol>
  1. Book
  2. Pen
  3. Pencil
  4. Rubber