Tutorial #7:
Utilizing Lists

Other tutorials
The Basics
The Basics - Part II
Working With Text
Text - Part II
Making Links
Images
Lists
Tables
CSS
CSS Text Control
CSS-P
Frames
Forms
JSS
Layers
Colors
Marquees

Lists are a simple, yet effective aspect of a web page. Lists can make you actually look like you know what you are doing. Read this simple, easy tutorial and you will be able to make your own.

What are some advantages of lists?

Lists are good for:
  • Organizing information
  • Presenting it in a clear, concise way
  • Making your site look "professional".
Just look at that list. Dosen't it look professional? Huh? Huh? The thing is, it isn't that hard to make at all. Have a look at the code:

<ul>
<li>Organizing information
<li>Presenting it in a clear, concise way
<li>Making your site look "professional".
</ul>

ul stands for Unordered List. It isn't numbered, so it is unordered. li stands for List Item. This obviously means that you are listing the item that will be bulleted. And of course, </ul> finishes off the whole deal.

Bullet effects

You can change the style of the bullet. There are three different types: disc, circle, and square. disc is the default. Here is how to change the bullet type:

<ul type="disc">
<ul type="square">
<ul type="circle">

Ordered Lists

Ordered lists are good for:

  1. Numerically organizing your information
  2. Presenting it in order
  3. Again - Making it look professional

The code is exactly the same, except that instead of <ul>, it is <ol>. There are five different types of ordered lists. The type "1" is the default, and you define the type in the same place. Here are the five types:

<ol type=A>
<ol type=a>
<ol type=I>
<ol type=i>
<ol type=1>

Type "A" orders things alphabetically in uppercase, and type "a" orders things alphabetically in lowercase. Type "I" orders things using uppercase Roman numerals, and type "i" orders things using lowercase Roman numerals.

That's all that there is to lists. The next tutorial is a long one, but it's worth the time. Click here to learn how to make and manipulate tables.