Basic HTML Tutorials

- Lists Tutorial -

Finally we start our first tutorial, which is how to create different types of lists. Lists are a very important element in any website and as you can see, I use many of them in my pages.

Lists are basically a sequence of items arranged in different patterns. There are different types of patterns and each has their own types and symbols. The three types of lists are:

Ordered Lists - list that uses a number or a letter order

Unordered Lists - list that uses a symbol to order list items

Definition Lists - list that has a defenition and an indented line as description

In this section, all three of these lists will be explained in detail starting with:

- Ordered Lists -

Ordered Lists are lists that arrange items or text in a number or flowing sequence (e.g. 1,2,3,4...etc or a,b,c,d...etc) as in the numbered list above. Ordered lists are very important for planning and showing steps.

The tag for an ordered list is <ol> (o-rdered l-list) it makes sense, doesn't it?

Every List contains list items which are represented by the following tag: <li>
(l-ist i-tem)

Of coarse you must identify the type of sequence you want your list to list your items in. For ordered lists, you must include the word "type" inside your <ol> tag. Here are some examples:

<ol>                                              to get (1,2,3,4...etc) - by default
<ol type="1">                               to get (1,2,3,4...etc) also
<ol type="a">                               to get (a,b,c,d...etc)
<ol type="i">                                to get (i,ii,iii,iv...etc) Each list tag <ol> has a list item tag <li> following it to identify the sequence of text in the list. The text must be included inside those list item tags e.g. (<li>first list item</li>)
Of coarse you must end an ordered list with </ol> tag.

Here's an example of a page with an ordered list: View Page