Creating
Lists In HTML
HTML
supports 4 types of lists, Ordered Lists, Unordered Lists , Definition Lists
and Directory lists
Ordered
Lists
Ordered
lists are the list of items with numbering. To create ordered lists use <ol></ol>
element. This element has the attribute type to specify the type of
numbering and it has the possible values 1, A, a, I, and i. it
has another attribute start to specify where to start numbering. In HTML
5 this element has a new attribute reversed and when it is set to “reversed”
then numbering will be given in descending order. Inside the <ol>
element use <li> element to create list of items.
Example
: The
following example demonstrates how to create ordered lists
<!doctype html><html><body><ol><li> Item1 </li><li> Item2 </li><li> Item3 </li></ol></body></html>
Example
: The
following example demonstrates nesting ordered lists
<!doctype html><html><body><ol><li> Item1 </li><li> Item2 </li><ol type=”I”><li> subitem1 </li><li> subitem2 </li><li> subitem3 </li></ol><li> Item3 </li></ol></body></html>
UnOrdered
Lists
UnOrdered
lists are the list of items with bullets. To create unordered lists use <ul></ul>
element. This element has the attribute type to specify the type of
bullet and it has the possible values Circle,Square
and disc. Inside the <ul> element use <li> element to
create list of items.
Example
: The
following example demonstrates how to create unordered lists
<!doctype html><html><body><ul><li> Item1 </li><li> Item2 </li><li> Item3 </li></ul></body></html>
Example
: The
following example demonstrates nesting Unordered lists
<!doctype html><html><body><ul><li> Item1 </li><li> Item2 </li><ul type=”square”><li> subitem1 </li><li> subitem2 </li><li> subitem3 </li></ul><li> Item3 </li></ul></body></html>
Example
: The
following example demonstrates nesting of ordered and Unordered lists
<!doctype html><html><body><ul><li> Item1 </li><li> Item2 </li><ol type=”a”><li> subitem1 </li><li> subitem2 </li><li> subitem3 </li></ol><li> Item3 </li></ul></body></html>
Definition
Lists
Definition
list is used to provide a list of definitions and use <dl> element to create
definition list. Within the element <dl>
use the element <dt>
to specify the definition term and the element <dd> to provide definition
for the term.
Example
:The
following example demonstrates how to create definition list
<!doctype html><html><body><dl><dt> Java </dt><dd> Java is one of programming languages </dd><dt> HTML/dt><dd> HTML is one of scripting language </dd><dt> Oracle </dt><dd> Oracle is a DataBase</dd></dl></body></html>
Directory
Lists (Not supported in HTML 5)
Directory
list is used to create a list of directories. To create a directory list, use <dir> element and within
this use <li> element
to specify the list.
Example
: The
following example demonstrates how to create directory lists
<!doctype html><html><body><dir><li>First</li><li>Second</li><li>Third</li></dir></body></html>
No comments:
Post a Comment