All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

HTML List

HTML has three kinds of lists.


  • <ol>It is called Ordered list it uses different schemes of numerals to list items.
  • <ul>It is called Unordered list it use bullets to list items.
  • <dl>It is called defination list it use to display data in defination style.


Ordered List (<ol>)

Ordered list uses various type of letters,numerals to list your data instead of bullets.

It uses type and start attribute to display list in different numerals.

  • type="1"Default numeral
  • type="I"Uppercase numeral
  • type="i"Lowercase numeral
  • type="A"Uppercase letter
  • type="a"Lowercase letter

  • Suppose start="2" so list numerals starts from second position of every numerals

  • Example of <ol>

    <ol type="1" start="2">
    <li>Apple</li>
    </ol>
    <ol type="I" start="2">
    <li>Banana</li>
    </ol>
    <ol type="i" start="2">
    <li>Mango</li>
    </ol>
    <ol type="A" start="2">
    <li>Carrot</li>
    </ol>
    <ol type="a" start="2">
    <li>Orange</li>
    </ol>
    

    Result of the above example

    1. Apple
    1. Banana
    1. Mango
    1. Carrot
    1. Orange



    Unordered List (<ul>)

    Unordered list uses different types of bullets to list your data.

    It uses type attribute to display list in different bullets.

    • type="square"
    • type="disc"
    • type="circle"

    Example of <ul>

    <ul type="square">
    <li>Apple</li>
    </ul>
    <ul type="disc">
    <li>Banana</li>
    </ul>
    <ul type="circle">
    <li>Mango</li>
    </ul>
    

    Result of the above example

    • Apple
    • Banana
    • Mango



    Defination List(<dl>)

    It is used to represent data in defination style it consist of two more tags:

    • <dt>It is called the term.
    • <dd>It is called the term defination.

    Example of <dl>

    <dl>
    <dt>HTML</dt>
    <dd>It is Hyper Text Markup Language</dd>
    <dt>CSS</dt>
    <dd>It is Cascading Style Sheet</dd>
    </dl>
    

    Result of the above Example

    HTML
    It is Hyper Text Markup Language
    CSS
    It is Cascading Style Sheet

    ❮ PreviousNext ❯