12 web design hours

Lists

....

Creating Lists

Lists can make text on Web pages easier to read. You can use lists to separate ideas or tie them together, or both.

HTML coding for lists is flexible and provides a wide range of options. In this lesson, you will define basic list types and creat unordered, ordered, and definition lists.

Defining Basic List Types

Using HTML, you can create unordered, and ordered, and definition lists.

  • Unordered lists are collections of related items deisplayed in no particular sequestnce - like many shopping lists. the lines of unorder lists are not numbered or lettered.

  • Ordered lists are collections of items in a specific pattern or order. Step-by-Step instructions and tables of contents are example of ordered lists.
  • Definition lists present collections of terms and explainiations. A glossary is a good example of definition lists.

<DL>
<DT>
Defined Term</DT>

<DD> Defined Definition: This can be a long paragraph of text that will wrap and indent in a manner similar to a definintion found in a dictionary.
<DD>

</DL>

HTML lists always include the list tags and line tags

  • List tags define the style of a list. Every list requires an opening list tag and a closing list tag.

The following table shows the three list styles and their list tags. Regardless of the number of items in the list, the opening list tag alway appears at the start of the list, and the closing tag always appears at the end.

List style List tags
Unordered list <UL> </UL>
Ordered list <OL></OL>
Definition list <DL> </DL>

The second tag required for HTML lists is the line tag, <LI> . the <LI> tag has no closing tag.... but it is ok to include one.

  • A line tag indicates to a browser that the text following it is a list item. A series of line tags makes up a list.

Line tags do not require a closing tag because the browser continues the list item until it encounters either another <LI> tag (indicating the start of another list item) or a closing list tag taht ends the list.

You can embed HTML formatting tags such as <B><I> within lists. YOu can also include hyperlinks and multimedia elements, so your list could include a list of your favorite websites.