Lists


There are many times you'll find yourself wanting to present your visitor with an organized list of items. And there are as many different ways to create your lists as there are reasons to use them.
Quickly before we get started, let me help you remember what you see here by defining them.
OL - Ordered List (by number)
LI - List Item (the actual item in the list)
UL - Un-ordered List (bullets)
The terms used for "definition lists" will be defined later, as part of the example for a definition list.
  1. Numbered lists
    These are simple lists with each entry labeled in succession, beginning with 1 (as you see in the layout of this page). These are great when communicating instructions that need to be followed in an order. To accomplish this, use the following construction: <ol><li>Item 1<li>Item 2<li>Item 3</ol> And you will get this:
    1. Item 1
    2. Item 2
    3. Item 3
    As you see, even running them together in one line of text doesn't alter their display. They'll still show as a proper list.
     Let's try some other variations:
    1. <ol start=10><li>We've skipped 4 through 9 <li>We went straight to 10.<li>Pretty slick, eh?</ol> Just by adding "start=10" to the "ordered list" command, we were able to control the beginning number of the list as shown below. It can be adjusted to your needs just by replacing "10" with the number of your choice.
      1. We've skipped 4 through 9
      2. We went straight to 10.
      3. Pretty slick, eh?
    2. <ol><li>Instruction 1<li value=3>We've skipped 2, going straight to 3<li value=5>Keeping with our odd numbers we have 5</ol> Just by adding values, we've changed the numbers of the ordered list. This means we could put instructions in random order, just by forcing the value of each particular item.
      1. Instruction 1
      2. We've skipped 2, going straight to 3
      3. Keeping with our odd numbers we have 5
      If you stop identifying values, the subsequent values will default to one higher than the last one. So, our next one after 5, would have been six, unless we specifically labeled a value for that item.

      See an example of this in use

    3. Maybe you prefer Roman Numerals <ol type=I><li>This is item 1, er I<li>This is item 2, er II<li>This is item 3, er III</ol>

      This gives us:

      1. This is item 1, er I
      2. This is item 2, er II
      3. This is item 3, er III
    4. What, you want lower case Romans? <ol type=i><li>This is item 1, er i <li>This is item 2, er ii<li>This is item 3, er iii</ol>

      This gives us:

      1. This is item 1, er i
      2. This is item 2, er ii
      3. This is item 3, er iii
    5. Speaking of case, were you wondering about the CAPITALS I used for this section?: <ol type=A><li>Item A<li>Item B<li>Item C</ol> This gives us:
      1. Item A
      2. Item B
      3. Item C
    6. Yes, we can make those lower case, too!: <ol type=a><li>Item a<li>Item b<li>Item c</ol>

      This gives us:

      1. Item a
      2. Item b
      3. Item c
       Oh, and yes, if you use the "start=" tag with a number in the Roman or alphetical variations, it will start you at the position you indicate. Wanna see a really cool take on that idea? <ol type=a start=25><li>Item y<li>Item z<li>Item aa<li>Item ab</ol>

      This gives us:

      1. Item y
      2. Item z
      3. Item aa
      4. Item ab
  2. Unordered (Bulleted) Lists
    These are lists that have less emphasis on a particular order but are just a random list of items. I have taught you the following <ul><li>Ordered by number in proper sequence <li>Ordered by random numbers or selected starting positions <li>Ordered using capital and lower case Roman numerals <li>Ordered using capital and lower case letters</ul>

    Here we get just a list, like this:

    I have taught you the following

    • Ordered by number in proper sequence
    • Ordered by random numbers or selected starting positions
    • Ordered using capital and lower case Roman numerals
    • Ordered using capital and lower case letters
     Again, we'll try some variations.
    1. Like hollow circles better? Try this:

      Here is what we are learning next <ul type=circle><li>Unordered lists using squares <li>Unordered lists using circles <li>Unordered lists using squares</ul>

      Here we get just a list, like this:

      Here is what we are learning next

      • Unordered lists using squares
      • Unordered lists using circles
      • Unordered lists using squares
    2. Moving on to squares:

      Here is what we are learning next <ul type=square><li>Unordered lists using squares <li>Unordered lists using circles <li>Unordered lists using squares</ul>

      Here we get just a list, like this:

      Here is what we are learning next

      • Unordered lists using squares
      • Unordered lists using circles
      • Unordered lists using squares
  3. Definition List
    When you want to define terms or phrases, this is the best way to do it. Let's better understand what we are using here <dl><dt>DL<dd>DL stands for Definition List and denotes the beginning of the definition section. <dt>DT<dd>DT is for Definition Term, the term to be defined <dt>DD<dd>DD refers to the Definition Description and is the definition or description of the DT</dl> Which displays as:

    Let's better understand what we are using here

    DL
    DL stands for Definition List and denotes the beginning of the definition section.
    DT
    DT is for Definition Term, the term to be defined
    DD
    DD refers to the Definition Description and is the definition or description of the DT



    Advanced Menu
    Lists   Iframes  

    Advanced Index   Entry Page/WebRings



    Last Update:
    9:58AM 12/27/04