Lists in HTML:
Let's discuss what is lists in HTML
The list is used to displaying information sequentially in an HTML. Lists are divided into three type. Namely,
1. Ordered list
2. Unordered list
3. Definition list
READ: Basic commands in HTML
1. Numbers 1, 2, 3,
2. Upper Case alphabets-A, B, C,
3. Lowercase alphabets- a, b, c,
4. Uppercase Roman numbers
5. Lowercase Roman numbers
<head>
<title> ordered list example</title>
</head>
<body>
<ol type="1">
<lh>Programming language
<li>c programming
<li>c++ programming
<li>java
<li>java script
</ol>
</body>
</html>
The output of this coding is
Programming language
1. Circle
2. Disc
3. Square
ALSO READ: Advantages and disadvantages in HTML
<head>
<title>unordered list</title>
</head>
<body>
<ul type="circle">
<lh>Programming language
<li>c programming
<li>c++ programming
<li>java
<li>java script
</ul>
</body>
</html>
Programming language
c programming
c++ programming
java
javascript
<head>
<title>Definition List</title>
Types of Lists in HTML:
Ordered List:<ol>..........</ol>
This list has a sequence of number in front of each list item. Every list item in <ol> tag must be encapsulated within the <li>tag is nothing but the list of item. The default sequential values are Arabic numerals, beginning with 1. In an order list the information is numbered by any one of the following:1. Numbers 1, 2, 3,
2. Upper Case alphabets-A, B, C,
3. Lowercase alphabets- a, b, c,
4. Uppercase Roman numbers
5. Lowercase Roman numbers
The general format is
<ol type="value" start="value">
<li> item1
<li> item2
<li> itemn
</ol>
Example
<html><head>
<title> ordered list example</title>
</head>
<body>
<ol type="1">
<lh>Programming language
<li>c programming
<li>c++ programming
<li>java
<li>java script
</ol>
</body>
</html>
The output of this coding is
Programming language
1.c programming
2.c++ programming
3.java
4.java script
2.c++ programming
3.java
4.java script
Unordered List:<ul>............</ul>
The <ul>, which is a block tag, creates an unordered list. Each item in a list is specified with a <li> tag. In an unordered list, the information is preceded by any one of the following bullets:1. Circle
2. Disc
3. Square
The general format is
<ul type="value">
<li>item 1
<li>item 2
<li>item n
</ul>
ALSO READ: Advantages and disadvantages in HTML
Example
<html><head>
<title>unordered list</title>
</head>
<body>
<ul type="circle">
<lh>Programming language
<li>c programming
<li>c++ programming
<li>java
<li>java script
</ul>
</body>
</html>
The output of this coding
Programming language
c programming
c++ programming
java
javascript
Definition List:<dl>.................</dl>
Definition lists are used to specify lists of terms and their definition as in glossary. A definition list is given as the content of a <dl> tag, which is a block tag. Each term to be defined in the definition list is given as the content of a<dt> tags. The definition themselves have specified as the content of<dd> tags. The defined terms of a definition list are usually displayed in the left margin; the definitions are usually shown indented on the line.
The general format
<dl>
<dt>item 1 <dd> definition 1
<dt>item 2 <dd> definition 2
--------------------------
--------------------------
<dt>item n <dd> definition n
</dl>
Example
<html><head>
<title>Definition List</title>
</head>
<body>
<dl>
<dt>Tea<dd>type of hot drink
<dt>Cofee<dd>Another type of Hot drink
</dl>
</body>
</html>
The output of this coding is
<body>
<dl>
<dt>Tea<dd>type of hot drink
<dt>Cofee<dd>Another type of Hot drink
</dl>
</body>
</html>
The output of this coding is
Tea
type of hot drink
Coffee
Another type of hot drink
type of hot drink
Coffee
Another type of hot drink
ALSO READ: Structure of HTML document
No comments:
Post a Comment