Site hosted by Angelfire.com: Build your free website today!
The Basic MUST HAVE tags
Text Style
Symbols
Headers
Breaks & Spaces
Colors
Images & Graphics
Lists
Tables
Forms
Feedback
Try it out NOW!



Lists



There are two kinds of Lists, Unordered (with bullets), and Ordered (with numbers or letters). Lists are a great way to add variety to your pages and to draw attention to important links or material

<ul></ul> makes a list with bullets (unordered list)

<li></li> each bulleted item goes in between these tags

<ol></ol> makes a list with increasing #'s (ordered list)

<li></li> each numbered item goes in between these tags

Lists
<html>
<head>
<title>Lists</title>
</head>
<body bgcolor=yellow>

<ul>This is an Unordered List<br>
    <li>One</li><br>
    <li>Two</li><br>
    <li>Three</li><br>
</ul>

<ol>This is an Ordered List<br>
    <li>First</li><br>
    <li>Second</li><br>
    <li>Third</li><br>
</ol>

</body>
</html>
    This is an Unordered List
  • One

  • Two

  • Three

    This is an Ordered List
  1. First

  2. Second

  3. Third

 
 
 

Nested Lists are easily created by simply adding another <ul> or <ol> tag before the final </ul> or </ol> tag.

Nested Lists
<html>
<head>
<title>Nested Lists</title>
</head>
<body bgcolor=yellow>

<ol>This is One Ordered & Nested List<br>
    <li>First</li><br>
    <li>Second</li><br>
      <ul>
        <li>One
        <li>Two
      </ul>
     <li>Third</li><br>
</ol>

<ol>This is Another Ordered & Nested List<br>
    <li>First</li><br>
    <li>Second</li><br>
      <ol type="A">
        <li>One
        <li>Two
      </ol>
     <li>Third</li><br>
</ol>

    This is One Ordered & Nested List
  1. First

  2. Second

    1. One

    2. Two

  3. Third

    This is Another Ordered & Nested List
  1. First

  2. Second

    • One

    • Two

  3. Third

 
 
 

Fancy lists:

<ul type="disc"> round filled in bullets

<ul type="circle"> empty circles

<ul type="square"> square bullets

<ul type="1"> numbers, (1,2,3...)

<ul type="A"> capital letters (A,B,C...)

<ul type="a"> lowercase letters (a,b,c...)

<ul type="I"> Uppercase Roman Numerals (I, II, III...)

<ul type="i"> Lowercase Roman Numerals (i, ii, iii...)

Definition Lists are used when creating a glossary, describing a topic or word, etc.

<dl></dl> start and end a definition list

<dt></dt> the word or phrase being defined

<dd></dd> the definition

Definition Lists
<html>
<head>
<title>Definition Lists</title>
</head>
<body bgcolor=yellow>

<dl>My Favorite Mark-up Languages<br>
   <dt>HTML</dt>
      <dd>Hyper-text Mark-up Language: Used to create Web Pages. Nowadays HTML has become so common that there are programs designed to do all the HTML for you.
      </dd><p>

   <dt>VRML</dt>
      <dd>Virtual Reality Mark-up Language: This creates 3-D worlds, is often what you see in games.
      </dd><p>

   <dt>XML</dt>
      <dd>Extensible Mark-up Language: A very intense and integrated language for easy use of SGML on the Web.
      </dd><p>

   <dt>DHTML</dt>
      <dd>Dynamic Hyper-text Mark-up Language: This is an advanced HTML for exciting and interactive Web Pages.
      </dd><p>

</body>
</html>
My Favorite Mark-up Languages
HTML
Hyper-text Mark-up Language: Used to create Web Pages. Nowadays HTML has become so common that there are programs designed to do all the HTML for you.
VRML
Virtual Reality Mark-up Language: This creates 3-D worlds, is often what you see in games.
XML
Extensible Mark-up Language: A very intense and integrated language for easy use of SGML on the Web.
DHTML
Dynamic Hyper-text Mark-up Language: This is an advanced HTML for exciting and interactive Web Pages.