Ordered List:
- Ordered List represented with <ol> tag.
- Ordered List creates list of items in number series.
- List of items represented with <li> tag.
- <li> tag always inside <ol> tag.
<ol>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
</ol>
OUTPUT:
OUTPUT:
- list item 1
- list item 2
- list item 3
Example :
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<center>
<h3>welcome to ordered list </h3>
<ol>
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
</center>
</body>
</html>
OUTPUT:
Ordered List Attributes: Type
- Most Commonly used attribute is "type" .
- By using type we can change sequence number type.
- Different types of type values are "a","A","i","I","1"
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<center>
<h3>Ordered list with default type</h3>
<ol>
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
<h3>Ordered list with type=I</h3>
<ol type="I">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
<h3>Ordered list with type=a</h3>
<ol type="a">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
<h3>Ordered list with type=i</h3>
<ol type="i">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
<h3>Ordered list with type=A</h3>
<ol type="A">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
<center>
</body>
</html>
OUTPUT:
By default ordered list type = 1
if you see all the types in output screen it will come with next sequence from type value.
Attribute : start
- START attribute indicates that, from which number sequence starts.
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<center>
<h3>welcome to ordered list </h3>
<ol type="1" start="3">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
</center>
</body>
</html>
OUTPUT:
If you see the output screen, the sequence start from 3.
List with Multiple types:
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<center>
<h3>welcome to ordered list </h3>
<ol>
<li type="1"> list one </li>
<li type="a"> list two</li>
<li type="A"> list three</li>
<li type="i"> list four</li>
</ol>
</center>
</body>
</html>
OUTPUT:
If you see the output, item sequence types are different from one another but the sequence follows.
Ordered List with Attribute : DIR
Ordered List with Attribute : DIR
- DIR attribute represents direction.
- List contains two types of directions, one is ltr (left to right) and rtl (right to left).
- Default direction is left to right (LTR)
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<center>
<h3>welcome to ordered list </h3>
<ol dir="ltr">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
<ol dir="rtl">
<li> list one </li>
<li> list two</li>
<li> list three</li>
<li> list four</li>
</ol>
</center>
</body>
</html>
OUTPUT:
0 comments:
Post a Comment