www.pickatutorial.com Computer Tutorials
Top eBooks: C/C++ | C# | Android | Mathematics | Database | Cloud | Graphics | Networking | Oracle | Hardware | AI
Top Tutorials: C/C++ | C#.NET | PHP MySQL | Java | Java Script | jQuery | HTML | xHTML | HTML5 | VB Script| CSS
Lessons HTML Lists Bookmark and Share
Tutorial Home
Lesson 1
Lesson 2
Lesson 3
Lesson 4
Lesson 5
Lesson 6
Lesson 7
Lesson 8
Lesson 9
Lesson 10
Lesson 11
Lesson 12
Lesson 13
Lesson 14
Lesson 15
Lesson 16
Lesson 17
Lesson 18
Lesson 19
Lesson 20
Lesson 21
Lesson 22
Lesson 23
Lesson 24
Lesson 25
Lesson 26
Lesson 27
Lesson 28
Lesson 29
Lesson 30
Lesson 31
Lesson 32
Lesson 33
Lesson 34
Lesson 35
Lesson 36
HTML supports three types of lists. Let's try to understand them one by one.

1. Unordered List

An unordered list has the following format:

  • First Item
  • Second Item
  • Third Item

HTML code for the above unordered list is very simple. The whole list is enclosed between <ul> and </ul> tags. Each list item is described using <li> and </li> tags.

<ul>
  <li>First Item</li>
  <li>Second Item</li>
  <li>Third Item</li>
</ul>

2. Ordered List

The second kind of html list is an Ordered List, also called a numbered list. A simple Ordered List is as under:

  1. First Item
  2. Second Item
  3. Third Item

HTML code for the above ordered list is very simple. The whole list is enclosed between <ol> and </ol> tags. Each list item is described using <li> and </li> tags.

<ol>
  <li>First Item</li>
  <li>Second Item</li>
  <li>Third Item</li>
</ol>
3. Definition List

The last kind of list that HTML supports is called a definition list. It is so called because it is in the format of a TERM followed by its DEFINITION. A simple definition list is as under:

First Item
Text describing the First Item
Second Item
Text describing the Second Item
Third Item
Text describing the Third Item

HTML code for the above definition list is very simple. The whole list is enclosed between <dl> and </dl> tags. Each term is described using <dt> and </dt> and the definition using <dd> and </dd>.

<dl>
   <dt>First Item </dt>
      <dd>Text describing the First Item</dd>
   <dt>Second Item</dt>
      <dd>Text describing the Second Item</dd>
   <dt>Third Item </dt>
      <dd>Text describing the Third Item</dd>
</dl>

Next >>> Lesson No. 12: Nesting Lists





Home - Advertise - Contact - Disclaimer - About Us
© Since 2006 pickatutorial.com -- All Rights Reserved.