List tags in HTML 5

List tags are used for specifying ordered , unordered lists, terms and their definitions.
  • 2118
  • <li>:- We use this tag to indicate that a list will be used in this tag. List will contain list item. Its contents can be value which will be number from where we want to start like 5. Its not mandatory to give number. We can simply write list item.

          Syntax:
         <
li> Item we want to give in list. </li>

           Code:

           <
!DOCTYPE HTML>
         <html>
         <body>
         <ol>
         <li> list  </li>
         <li> item </li>
         </ol>
         </body>
         </html>

        Output:

          li 1.gif

  • <ol>:- We use this tag to indicate that we are going to start an ordered list.

     Attributes:
      
          
    a) start :- We can use start attribute with tag to specify the number from where list items will be 
             started.
           b) reversed :-We can use this attribute to specify the descending number from where the list will
              be started and then continue.

           Syntax:
          <
ol start ="Number from where you want to start your list items">
          <
li> Item we want to give in list. </li>
        </ol>

        Code:
       
        <!DOCTYPE HTML>
        <html>
        <body>
        <ol start="5">
        <li> I m list tag </li>
        <li> I m ol tag </li>
        </ol>
        </body>
        </html> 
       
        Output:

          ol 1.gif
 

  • <ul>:-We can use this attribute to show a list without any order. So in this tag, we use bulleted lists which has no number.

    Syntax:
    <
    ul>
    <li> List item you want to display </li>
    </ul>

    Code:

    <!DOCTYPE HTML>
    <html>
    <body>
    <ul>
    <li> I m <b> ul</b> tag
    <li> I m unordered list </li>
    </ul>
    </body>
    </html>

    Output:

      ul 1.gif

     
  • <dl>:- We use this tag to show a term and its description with tags <dt> and <dd>.

    Syntax:
    <
    dl>
    <dt> Term you want to use </dt>
    <dd> Description </dd>

    Code:

    <!DOCTYPE HTML>
    <html>
    <body>
    <ul>
    <li> I m <b> ul</b> tag
    <li> I m unordered list </li>
    </ul>
    <dl>
    <dt> HTML </dt>
    <dd> Hypertext Markup Language </dd>
    </dl>
    </body>
    </html>

    Output:

    dl 1.gif
     

  • <dt>:- This tag is used to specify a term that has some identity in real world.

    Syntax:
    <
    dt> Term you want to give </dt>

    Code:

    <!DOCTYPE HTML >
    <html>
    <body>
    <dl>
    <dt> ASP </dt>
    <dd><b>Active Server Pages</b></dd>
    </dl>
    </body>
    </html>

    Output:

     
  • <dd>:- This tag is used to show description of some term which have some identity in real world.

    Syntax:
    <
    dd> Description of term </dd>

    Code:

    <!DOCTYPE HTML >
    <html>
    <body>
    <dl>
    <dt> DS</dt>
    <dd> <b> Data Structure </b> </dd>
    </dl>
    </body>
    </html>

    Output:
    ddr 1.gif
© 2020 DotNetHeaven. All rights reserved.