Page 95 - 2610_Springdales_C-7
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
