3755A - Lists

HTML lists come in 3 flavours: ordered, unordered and definition lists. Each can have attributes which affect how they display.

Read through the list tutorial on tizag and you'll see what is possible.

One thing the tizag tute neglects to mention is that lists can contain other lists within them. A list element can be a whole new list of its own. This is known as a nested list.

For example:

1. first list, first element
   
2. first list, second element (also contains a nested list)
   
   
   
   1. second list, first element
      
   
   

Which is generated by using the following code:

<ol>

<li>first list, first element</li>

<li>first list, second element (also contains a nested list)

<ol>

<li>second list, first element</li>

</ol>

</li>

</ol>



See if you can reproduce the following page using nested lists:

"What about CSS?" I hear you ask. Have a look at the css list lesson on Web page design for designers. For the terminally curious, A List Apart has an in depth description of some serious CSS list tinkering. See if you can re-create their list "buttons" as a series of links from a home page to your own 3755A exercises.