Page 95 - Trackpad_V4.0_c7_Flpbook
P. 95

CSS List Properties

                 CSS list properties are used to change the appearance of ordered and unordered lists in HTML5.
                 These properties with their values are given in the following table:

                    Property                         Value                                   Description
                                   For ordered list: decimal, lower-alpha,

                 list-style-type   upper-alpha, lower-roman, upper-roman       Specifies the type of the list item
                                                                               marker.
                                   For unordered list: disc, circle, square
                                                                               Specifies an image to be used as the
                 list-style-image URL of the image                             list item marker instead of the default
                                                                               marker.
                                                                               Specifies the color of the list item
                 list-style-color  Colour name
                                                                               marker.

                 Ordered List

                 An ordered list is also called the numbered list. This type of list is used to display the items in a sequential
                 manner. For example, steps in an algorithm, etc. In HTML, the <OL> tag is used to create an ordered list.

                 The <LI> tag is used to define an item in the list. It is a container tag. The <OL> tag has two attributes
                 named START and TYPE. You can use the START attribute in the following way:

                    <OL START="1"> - will start the list from 1 if the list-style-type property is set to decimal. By default,
                   HTML starts from 1 if the START attribute is not specified.

                    <OL START="4"> - will start the list from d if the list-style-type property is set to lower-alpha.

                    <OL START="5"> - will start the list from E if the list-style-type property is set to upper-alpha.

                    <OL START="2"> - will start the list from ii if the list-style-type property is set to lower-roman.

                    <OL START="4"> - will start the list from IV if the list-style-type property is set to upper-roman.
                 The START attribute accepts only integer values.

                 Let us use the <OL> tag.

                 <HTML>

                 <HEAD> <TITLE> Ordered List or Numbered List </TITLE> </HEAD>

                 <BODY>

                 <B> Cup of Tea </B>
                 <HR>

                 Steps to make a cup of Tea.

                 <OL STYLE="list-style-type:decimal;">
                   <LI> Take 3/4 cup of water and boil it in kettle. </LI>

                   <LI> Add a table spoon sugar. </LI>




                                                                                        Lists and Tables in HTML5   93
   90   91   92   93   94   95   96   97   98   99   100