List in HTML

List in HTML


Lists provide the information in a structured and easy to read format. The data item on the webpage can catalogued or indexed. The index that is formed using numbers like 1,2,3,…or symbols like →, b, ∞ is called a List in HTML. These lists help in formatting the data and put them in a particular order. There are three types of lists that you can use in HTML. They are:

  • UL - creates an unordered or bulleted list
  • OL - creates an ordered or numbered list
  • DL - creates a definition or glossary list

The first two are very similar in structure, while definition lists have a unique setup. To create either kind, first specify the start of a list and then identify each line item in the list

1. Unordered List <ul> ….</ul>

It classifies the data items that have equal importance i.e. none of the data items are ranked. They are identified by a symbol. It may be a □ square, a ○ circle or a ● disc. The attribute TYPE helps in using the symbols to create a list. This attribute takes the value as the name of the symbol.

<ul type=”square”>
<ul type=”disc”>
<ul type=”circle”>

This is a container tag. It has both the opening and the closing tag. However the closing tag is optional. The listing is created under it using the <li> tag. Again <li> tag is a container tag. The data item to be listed is input between the opening <li> and the closing </li> tag as shown in the following example:

<body>
<ul>
<li>apples </li>
<li>oranges</li>
<li>guava </li>
</ul>
</body>

2. Ordered Lists <ol> … </ol>

It classifies the data items that do not have equal importance. All the data items are ranked. The ranking can be done using the numbers, the roman letter or alphabets. The default symbol is number. In case you want to change to other symbols of ordered list, you can use the attribute. The attributes used with this tag are given in the table below:


Attributes of <ol> tag
Description
TYPE
Changes the symbol used with the list. It takes the value as the symbol itself i.e. it can be “a” or “A” or “I” or “i” or “1”.
START
Begins the list with value specified. It takes the value of the symbol from where to begin the list

Example:

<body>
<ol>
<li>Get up in the morning</li>
<li>Brush your teeth</li>
<li>Take the bath</li>
<li>Eat the breakfast</li>
<li>Get ready to go to school</li>
</ol>
</body>

3 Definition Term Lists <dl> …. </dl>

Definition lists (<dl>) are the list elements that have an array of tags. The list prepared by <dl> tag is similar to a dictionary. The other tags used with this are <dt> to define the definition term and the <dd> for the definition of the list item.


Example:

<dl>
<dt>clairvoyance</dt>
<dd>French word for ability to see events in the future.</dd>
<dt><b>Esprit de corps</b></dt>
<dd>French word for feeling of pride and loyalty.</dd>
</dt>
</dl>



Programs

Create a webpage divide the webpage into six frames In one frame create five links that will display different HTML forms in the remaining five frames respectively

View Solution


Write a HTML program to create a form for the subscription of a magazine

View Solution


html table for Indian Tourist Spots

View Solution


Create html web page for Gateway of India

View Solution


Create a page with two frames using HTML

View Solution


CCC Online Test 2021 CCC Practice Test Hindi Python Programming Tutorials Best Computer Training Institute in Prayagraj (Allahabad) Best Java Training Institute in Prayagraj (Allahabad) Best Python Training Institute in Prayagraj (Allahabad) O Level NIELIT Study material and Quiz Bank SSC Railway TET UPTET Question Bank career counselling in allahabad Sarkari Naukari Notification Best Website and Software Company in Allahabad Website development Company in Allahabad Sarkari Exam Quiz