AlfieWebDevTips Homefor new and experienced developers
[Home Home] [Web Development Web Development ] [Code Generators Code Generators ] [Resources Resources ] [Contact Us Contact ] |WebDevTips Privacy Privacy |
WebDevTips Pick Of The Day : Add To Favorites How To |

Print This Page

You are here : Home - Web Development - HTML - Lists

A Look at Lists

Lists are a great way of presenting data. Lists have various styles of presentation and this guide will take you through the different layouts achievable with list tags .

There are 3 main types of list (there are more but they are getting depreciated so I won't cover them here)

Let's look at the list types we will be looking at.

The Un-Ordered list
  • item 1
  • item 2
  • item 3
The Ordered list
  1. Item 1
  2. Item 2
  3. Item 3
The Definition list
Heading 1
Heading 2

Before we start let's clear up a few issues regarding lists. While learning my trade I have discovered a lot of mis-information about lists. So to clarify the position before we start I will explain the aim of the guide.

The guide will concentrate on the 3 main list types - others are being depreciated so it is not recommended that they be used.

Next is valid syntax and nesting. You may have heard that the closing </li> is optional - while this is sort of true it can cause problems with nested lists and with validation etc.

The guide will only show you proper formatting with code that passes validation. Any list attributes that do not validate will be excluded.

So there you have it, now all the rambling is out of the way we can look lists in more detail, starting with the un-ordered list.

a look at lists | un-ordered list | ordered list
definition list

Why not discuss this article in our forum?
Other related guides : webpage basics | forms


[back to top of page]   

[labelled with icra -  - this link will open in a new window] [RSS Content]

[Copyright © WebDevTips]