Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 107 - 2626_South Point_C-7
P. 107

    LISTS

                     A list is a collection of related items.
                     HTML offers the concept of Lists which can used to insert data items in a specific order. Lists can be of

                     three types. They are:
                     1.  Unordered lists                 2.  Ordered lists               3.  Definition lists
                     So, let’s learn how to use these lists in HTML.

                          Unordered List

                     The lists which contain symbols for the list items or the list items which are marked with bullets are
                     known as Unordered lists. The tag that is used to create an unordered list is <UL> tag. <UL> stands for
                     unordered list. This is a container tag.

                     Creating Unordered List

                     There are different types of unordered lists. The type can be set using the ‘type’ attribute inside the
                     <UL> tag. The different types of styles for unordered lists are: circle, square and disc. By default, the
                     unordered lists have disc type. The tag that is used to create individual list item inside the <UL> tag is
                     <LI>. Here <LI> means List Item. Let’s see some simple examples to create an unordered list.
                     For example,

                      <!DOCTYPE HTML> <HTML><HEAD><TITLE> LIST1 </TITLE></HEAD>
                      <BODY STYLE="COLOR: BLUE">

                      <H1> Learning to create unordered lists</H1>
                      <H2> Creating a list of sports
                      offered in the academy</H2>

                      <UL>
                          <LI>Table Tennis
                          <LI>Tennis

                          <LI>Badminton
                                                                                          Unordered List
                      </UL> </BODY> </HTML>

                     Same code with type=’circle’

                      <!DOCTYPE HTML> <HTML><HEAD><TITLE> LIST2 </TITLE></HEAD>
                      <UL TYPE=CIRCLE>
                          <LI>Table Tennis

                          <LI>Tennis
                          <LI>Badminton
                      </UL> </BODY> </HTML>
                                                                                      Unordered list with type as circle

                                                                                                      More on HTML5   105

| 102 103 104 105 106 107 108 109 110 111 112 |