Ordered Lists Using Ol Tag

Create an ordered list with the ol tag

We use the ol tag to create an ordered list on our web page. The <ol> tag indicates the start of the list, and the </ol> tag indicates the end of the list. The elements of the list are written between the <li>...</li> tags.

When the page is run, each element between the li tags is placed on a new line with a sequence number at the beginning.

The parameters of the ol tag are:

Type parameter: It determines the sorting. If not used, sorting is done as 1-2-3. Apart from that, it can take the following values:

Type="A" : ABC ...

Type="a" : abc ...

Type="I" : I-II-III-IV ...

Type="i" : i-ii-iii-iv

Start parameter: If it is desired to start the sequence from a certain element rather than from the beginning, it is specified here which element to start from. E.g;

If Type="A" is used as Start="3" , the sorting starts from the letter C.

ol tag usage, html list creation, ol tag examples, li tag, ordered list, how to use ol tag

EXERCISES

Nested Ol and Ul Tags Try It
<ol type="A">
<li>Web Design
<ul>
<li>HTML
<ol type="I">
<li>Text editing</li>
<li>Tables</li>
<li>Layers</li>
</ol>
</li>
<li>CSS
<ol type="I">
<li>Native Styles</li>
<li>General Styles</li>
<li>Class and id</li>
</ol>
</li>
</ul>
</li>
<li>Database</li>
<li>Graph</li>
<ul>
<li>Photoshop</li>
<li>Flash
<ol type="I">
<li>Tween</li>
<li>AS3</li>
</ol>
</li>
</ul>
 
<li>PHP</li>
</ol>

 

Using Nested Ol Tags Try It
<ol>
<li>Web Design
<ol type="A">
<li>Html</li>
<li>Css</li>
<li>JavaScript</li>
<li>Asp.NET</li>
</ol>
</li>
<li>Grafik
<ol type="A">
<li>Fireworks</li>
<li>Flash</li>
</ol>
</li>
<li>Database</li>
</ol>
Ol Tag Example Try It
<ol type="i">
<li>Notepad</li>
<li>Dreamweaver</li>
<li>Fireworks</li>
<li>Photoshop</li>
<li>Flash</li>
</ol>


COMMENTS




Read 911 times.

Online Users: 474



using-ol-tag