List tags in HTML 5
- <li>:-
We use this tag to indicate that a
list will be used in this tag. List will contain list item. Its contents can
be value which will be number from where we want to start like 5. Its not
mandatory to give number. We can simply write list item.
Syntax:
<li> Item we want to give
in list. </li>
Code:
<!DOCTYPE HTML>
<html>
<body>
<ol>
<li> list </li>
<li> item </li>
</ol>
</body>
</html>
Output:
![li.gif]()
- <ol>:- We use this tag to indicate
that we are going to start an ordered list.
Attributes:
a) start :- We can use start
attribute with tag to specify the
number from where list items will be started.
b) reversed :-We can use this attribute
to specify the descending
number from where the list will be started and then
continue.
Syntax:
<ol
start
="Number from where you want to start your list items">
<li> Item we want to
give in list. </li>
</ol>
Code:
<!DOCTYPE HTML>
<html>
<body>
<ol start="5">
<li> I m list tag </li>
<li> I m ol tag </li>
</ol>
</body>
</html>
Output:
![ol.gif]()
- <ul>:-We can use this attribute to
show a list without any order. So in
this tag, we use bulleted lists which
has no number.
Syntax:
<ul>
<li> List item you want to display </li>
</ul>
Code:
<!DOCTYPE HTML>
<html>
<body>
<ul>
<li> I m <b> ul</b> tag
<li> I m unordered list </li>
</ul>
</body>
</html>
Output:
![ul.gif]()
- <dl>:- We use this tag to show a
term and its description with tags <dt> and <dd>.
Syntax:
<dl>
<dt> Term you want to use </dt>
<dd> Description </dd>
Code:
<!DOCTYPE HTML>
<html>
<body>
<ul>
<li> I m <b> ul</b> tag
<li> I m unordered list </li>
</ul>
<dl>
<dt> HTML </dt>
<dd> Hypertext Markup Language </dd>
</dl>
</body>
</html>
Output:
![dl.gif]()
- <dt>:-
This tag is used to specify a term that has some identity in real world.
Syntax:
<dt> Term you want to give </dt>
Code:
<!DOCTYPE HTML >
<html>
<body>
<dl>
<dt> ASP</dt>
<dd><b>Active Server Pages</b></dd>
</dl>
</body>
</html>
Output:
![dt.gif]()
- <dd>:- This tag is used to show
description of some term which have some identity in real world.
Syntax:
<dd> Description of term </dd>
Code:
<!DOCTYPE HTML >
<html>
<body>
<dl>
<dt> DS</dt>
<dd> <b> Data Structure </b> </dd>
</dl>
</body>
</html>
Output:
![ddr.gif]()