HTML List
Lists are a common way to present data in a formatted manner on a webpage. For example, if you need to display the menu of a pizza restaurant, an HTML list style would likely be used to present the information in a clear and organized way.
All lists must contain one or more list elements. There are two types of list elements:
- Ordered List <ol> Element
- Unordered List <ul> Element
Ordered List Element
An ordered list is a type of HTML list that presents information in a numbered format. To create an ordered list in HTML, you can use the <ol> tag, and then list each item within the list using the <li> tag.
By default, the type for any ordered list is a number starting from 1. We can also change the type of these ordered lists, like starting from 1, I, i, a, and A.
<ol type = "1"> - Default-Case Numerals.
<ol type = "I"> - Upper-Case Numerals.
<ol type = "i"> - Lower-Case Numerals.
<ol type = "A"> - Upper-Case Letters.
<ol type = "a"> - Lower-Case Letters.
Following is an example to demonstrate the type of an ordered list.
We can also control the start of any list type. We use the start attribute for <ol> tag to specify the starting point of numbering.
tryhtml_We use start attribute for tag to specify the starting point of numbering.]
Unordered List
When it comes to the Unordered list, all the list items are marked with a bullet point or other marker, rather than a number. To create an unordered list in HTML, you can use the <ul> tag, and then list each item within the list using the <li> tag.
By default, the type for any unordered list starts from bullets. We can change the type of the unordered list type as well – square, circle, disc.
<ul type = "square">
<ul type = "disc">
<ul type = "circle">
Following is an example to demonstrate the type of an ordered list.
Description or Definition List
A Description list is a list style that is supported by HTML and XHTML. It is also known as a definition list where entries are listed like a dictionary or encyclopedia.
The definition list is very appropriate when you want to present a glossary, list of terms, or other name-value lists.
<dl> tag - defines the start of the list
<dt> tag - defines a term
<dd> tag - defines the term definition (description)
Let’s understand the above tag with the help of the example:-
Nested List
A nested list is a list that is contained within another list, either an ordered list or an unordered list. To create a nested list in HTML, you can simply add a new <ul> or <ol> tag within an existing <li> tag.
Supporting Browsers
Element |
|||||
List |
Yes |
Yes |
Yes |
Yes |
Yes |