HTML List

HTML List is use for listing information, so that they are clearly associated with each other. Lists are used all the time on the website for navigation menus, product features etc.

In HTML, there are 3 types of List available, they are:

Unordered list

Ordered list

Description list

Unordered List

An unordered list is a collection of related list items that have no special order or sequence. An unordered list is created by using HTML <ul> tag, each item in the list is defined with <li> tag, and will be displayed as a bullet.

Example 1: HTML unordered list

Web Designing Tools
<ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JS</li>
    <li>jQuery</li>
</ul>

Attribute	Value	Syntax	Output
type	disc (default)	<ul type="disc">	disc list
	circle	<ul type="circle">	circle list
	square	<ul type="square">	square list

Ordered List

If you are required to put your list items in a number or in a sequence instead of bullets, then HTML ordered list is useful. <ol> tag is used to create HTML Ordered List.

Example 2: HTML ordered list.

Web Designing Tools
<ol>
    <li>HTML</li>
    <li>CSS</li>
    <li>JS</li>
    <li>jQuery</li>
</ol>

Attribute	Description
start	Specify the starting value for a list.
type	Specify ordered list type, value can be '1','a','A','i','I'

Example 3: HTML ordered list with start attribute.

List item 1
List item 2
List item 3

<ol type="a" start="5">
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
</ol>

Description List

A description list is a list of terms, with a description of each term. The <dl> tag defines the description list, the <dt> tag defines the term (Heading), and the <dd> tag, describes each term.

Example 4: HTML Description list.

<html>
   <body>
      <dl>
         <dt>HTML</dt>
         <dd>Hyper Text Markup Language is use to define tags that are useful to create a website layout.</dd>
         <dt>CSS</dt>
         <dd>Cascading Style Sheet is the style sheet use to style the html elements i.e. color, font, background etc.</dd>
         <dt>Js</dt>
         <dd>JavaScript is a client side scripting language use to create website dynamic.</dd>
      </dl>
   </body>
</html>