HTML5 tutorials n html examples: Creating topic list


Readhere our 1st tutorials HTML5 tutorials n html examples part 1 .

HTML5 tutorials n html examples: creating topic list part 2 :
Now we are going to learn how to create topic list with html 5. As a part of complete HTML 5 tutorials with example we have tried to publish html list making in the BOX below.>>>>>>>
 1. Ordered list.
2. Unordered list.
3. Nested list
4. Dropdown list.


1. Ordered list making with html5:


To create ordered list you have to put it under <ol></ol> tag and have to put the each list under <li></li> tag.
Watch the code below as example:

<html>
<body>
<h3>An ordered list of topic<h3>
<ol>
 <li>Famous paintings</li>
<li>Romantic paintings</li>
<li>Sports</li>
<li>Tutorials</li>
</ol>
</body>
</html>

Save the code in your textdocument/notepad as orderedlist.html      then run....
These the output :

 

2. unordered list making with html5:

And for unordered list just replace the <ol></ol> tag with <ul></ul>  tag.
Just like …..

<html>
<body>
<h3>unordered list of topic<h3>
<ul>
 <li>Famous paintings</li>
<li>Romantic paintings</li>
<li>Sports</li>
<li>Tutorials</li>
</ul>
</body>
</html>

Save the code in your textdocument/notepad as unorderedlist.html    then run

Output :



3. Nested list making with html5:

HTML Nested lists : if you want to show a list under another list with html then watch the code below.
<html>
<body>
<h3>nested list example<h3>
<ul>
<li>Paintings</li>
<ul>
<li>Famous paintings</li>
<li>Romantic paintings</li>
<li>natural  paintings</li>
</ul>
<li>Sports</li>
<li>Tutorials</li>
</ul>
</body>
</html>





4. Dropdownlist making with html5:

For dropdown list watch the html code below:
<html>
<body>
<from action="">
<select name=myworld>
<option value="paintings">paintings</option>
<option value="Romantic paintings">Romantic paintings</option>
<option value="Sports">sports</option>
<option value="tutorials">tutorials</option>
</select>
</from>
</body>
</html>

 

Save the code as dropdownlist.html and run….you will see the output just like below >>>>>



More information ,tutorials of HTML ,php here >>>>>>>>>>>>>