Press "Enter" to skip to content

List Examples in HTML

Last updated on October 4, 2019

Definition :

  • List is a process of displaying the content in listing fashion. There are three different types of lists are available.
  • Ordered list
  • Unordered list
  • Definition List

Ordered List :

  • These are the list which is meant for displaying the content in specific order on the web page.
  • By default it will take numbers.

Program :

<html>

    <body>

                    <ol>

                                    <li> Hello </li>

                                                <li> Hi </li>

                                                <li> H r u </li>

                                                <li> End </li>

                                </ol>

        <ol type=”1″ start=”100″>

            <li> Hello </li>

            <li> Hi </li>

            <li> H r u </li>

            <li> End </li>

        </ol>

        <ol type=”a”>

            <li> Hello </li>

            <li> Hi </li>

                                                <li> H r u </li>

                                                <li> End </li>

                                </ol>

        <ol type=”A”>

            <li> Hello </li>

                                                <li> Hi </li>

                                                <li> H r u </li>

                                                <li> End </li>

                                </ol>                    

                                <ol type=”i”>

                                    <li> Hello </li>

                                                <li> Hi </li>

                                                <li> H r u</li>

                                                <li> End </li>

                                </ol>

                </body>

</html>

UnOrdered List :

  • These are the list which is meant for displaying the content by using bullets.
  • By default it will take bullets(.).

Program :

<html>

    <body>

                    <ul>

                                    <li> Hello </li>

                                                <li> Hi </li>

                                                <li> H r u </li>

                                                <li> End </li>

                                </ul>

        <ul type=”disc”>

            <li> Hello </li>

            <li> Hi </li>

                                                <li> H r u </li>

                                                <li> End </li>

                                </ul>

        <ul type=”circle”>

            <li> Hello </li>

                                                <li> Hi </li>

                                                <li> H r u </li>

                                                <li> End </li>

                                </ul>                    

                                <ul type=”square”>

                                    <li> Hello </li>

                                                <li> Hi </li>

                                                <li> H r u</li>

                                                <li> End </li>

                                </ul>

                </body>

</html>

Definition List :

  • These are the list which is meant for displaying the content in some specific indentation.

Program :

<html>

    <body>

                    <dl>

                                    <dt> Characters </dt>

                                                    <dd> a </dd>

                                                                <dd> b </dd>

                                                                <dd> c </dd>

                                                <dt> Numbers </dt>

                                                    <dd> 1 </dd>

                                                                <dd> 2 </dd>

                                                                <dd> 3 </dd>

                                </dl>

                </body>

</html>

Sample Example of List :

Program :

<html>

    <body>

                    <dl>

                                    <dt> Andhra Pradesh </dt>

                                </dl>

                                <ol>

                                    <li> kadapa </li>

                                </ol>

                                <p align=”left”>

                                    <ol type=”a”>

                                                    <li> abc </li>

                                                                <li> xyz </li>

                                                </ol>

                                </p>

                                <dl>

                                    <dt> Karnataka </dt>

                                </dl>

                                <ol>

                                    <li> Mysore </li>

                                </ol>

                                <p align=”left”>

                                    <ol type=”a”>

                                                    <li> abc </li>

                                                                <li> xyz </li>

                                                </ol>

                                </p>

                </body>

</html>

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *