HTML Code Examples Index
1. HTML Page Layout Basics	2. Creating HTML Hyperlinks	3. Creating HTML Tables
4. Font/Text Types & Colors	5. Working With HTML Images	6. Creating HTML Lists
7. Working With Backgrounds	8. Importing JavaScript Files	9. Importing CSS Files

Creating HTML Lists

Lists in HTML are too easy to create, there are 2 types of lists:

• UnOrdered List
• Ordered List

1. Unordered List

Unordered lists are the standard type of lists that everyone uses.

For example you can create a list consisting of (a, b, c...etc) or even (i, ii, iii...etc).

To understand how to create a list, watch the following code:

<ul>               	 *** Unordered List Starting Tag.

    <li>Games</li>     *** First Bullet On The List.
    <li>Videos</li>    *** Second Bullet On The List.
    <li>Contact</li>   *** Third Bullet On The List.

</ul>                  *** Unordered List Ending Tag.

As you can see from the code above you start an ordered list with a <ul> and you end it with a </ul> however to create any bullets within the list you use <li> for each one you would like to create.

The code above gives you a list such as this:

• Games
• Videos
• Contact

2. Ordered List

By default ordered lists will start their index using numbers from 1 to wherever you end the list.

You can change the index type of an ordered list to a different one as I will show you below, but let us start with the standard definition of an ordered list first.

Observe the code below:

<ol>                   *** Ordered List Starting Tag.

    <li>Games</li>     *** First Bullet On The List.
    <li>Videos</li>    *** Second Bullet On The List.
    <li>Contact</li>   *** Third Bullet On The List.

</ol>            	     *** Ordered List Ending Tag.

The above code will give you the following list:

1. Games
2. Videos
3. Contact

3. Custom List Index

You can create a custom index for your any list by adding the attribute "type" in your opening tag such as the example below:

<ol type="a">      *** Adding type="a" to the <ol> tag specifies 
                       the index type to be used in this list.

    <li>Games     
    <li>Videos    
    <li>Contact   

</ol>

The above will give you the following results:

• Games
• Videos
• Contact

Let me show you 1 more thing, let's say you want to create a custom index for your list BUT you want to start it from a certain letter or number, in that case we will add another attribute called "start".

Check out the example below:

<ol type="1" start="4"> *** Adding the "start" attribute with the 
                            number you want the index to start at.

    <li>Games</li>     
    <li>Videos</li>    
    <li>Contact</li> 

</ol>

This will give you the following results:

4. Games
5. Videos
6. Contact

You can do the same thing with letters however you still use a number for the start attribute to locate the letter in the alphabet such as the example below:

<ol type="a" start="4"> *** Adding the "start" attribute with the 
                            number you want the index to start at.
                            In this case the index will start at
                            "d" since it is the 4th character in 
                            the alphabet.

    <li>Games</li>     
    <li>Videos</li>    
    <li>Contact</li> 

</ol>

The above code will give you the following list:

4. Games
5. Videos
6. Contact

Now that you know that you can add the type attribute to both an Ordered and UnOrdered List.

type="1"       *** A list with an index starting with the number 1.

type="a"       *** A list with an index starting with the letter a.
type="A"       *** A list with an index starting with the letter A.

type="i"       *** A list with an index starting with Non-Capital Roman numerals.
type="I"       *** A list with an index starting with Capital Roman numerals.

type="disc"    *** A list with a disc-looking symbol.
type="circle"  *** A list with a circle for a symbol.
type="square"  *** A list with a square for a symbol.