Types of Lists in HTML
Previously we have seen, The Special Characters in HTML. Today we are going to learn about Different Types of Lists in HTML. So let's get started...
Types of Lists in HTML
A list allows the user to create a group of related items set, which will help them to put those related items in a specific sequence according to their understanding.
Each and every list item in HTML lies in between <li> tag, which stands for List Items. In the HTML Language generally, there are three types of lists as given below :
%20(1).png)
1. Ordered List
This List type represents the List Items with a numerical starting and it includes all the list items with <li> tag in between Ordered List Tag (<ol>). You can list the list items in different types such as numerals, alphabets, roman numbers, and so on by using the CSS Property list-style-type.
2. Unordered List
This list type represents the List Items with a bullet starting and it includes all the list items with <li> tag in between Unordered List Tag (<ul>). You can list the list items in different types of bullets such as circle bullet, square bullet, disc bullet, and so on by using the CSS Property list-style-type.
3. Description List
This list type represents the List Items in the form of concepts and the description of those concepts. These concepts are also known as the Description List Term indicated by <dt> tag. Description List Term can be described in this type of list by using Define Description Term indicated by <dd> tag. Both the Description List Tag (<dt> and <dd>) lies in between Description List Tag (<dl>).
Ordered List
Example :
<!DOCTYPE html>
<html>
<head>
<title> Ordered List </title>
</head>
<body>
<h2>Ordered List - Coffee's</h2>
<hr>
<ol>
<li>Latte Coffee</li>
<li>Americano Coffee</li>
<li>Cappuccino Coffee</li>
<li>Mocha Coffee</li>
<li>Espresso Coffee</li>
</ol>
</body>
</html>
Unordered List
Example :
<!DOCTYPE html>
<html>
<head>
<title> Unordered List </title>
</head>
<body>
<h2>Unordered List - IT Companies</h2>
<hr>
<ul>
<li>Tata Consultancy Services</li>
<li>Infosys</li>
<li>HCL Technologies</li>
<li>Wipro</li>
<li>Redington India Ltd.</li>
</ul>
</body>
</html>Description List
Example :
<!DOCTYPE html>
<html>
<head>
<title> Description List </title>
</head>
<body>
<h3>Description List - Programming Language Subject</h3>
<hr>
<dl>
<dt>PCI</dt>
<dd>This is Stands for "Programming in C"</dd>
<br>
<dt>WPD</dt>
<dd>This is Stands for "Web Page Designing with HTML"</dd>
<br>
<dt>AJP</dt>
<dd>This is Stands for "Advance Java Programming"</dd>
</dl>
</body>
</html>So, now it's time to end the session. See you guys Next Time, stay tuned for further updates on HTML Programming Languages...!!!
I hope, our website will definitely help you to improve your Programming Skills and Knowledge.
Thanks for Visiting...!!!
0 Comments
Please do not add Any Spam link in Comments !