Lists

The original HTML specification included tags for five different types of lists: numbered lists (called ordered lists), bulleted lists (called unordered lists), definition lists, menus, and directory lists. Since then, directory lists and menus have been deprecated with the recommendation that unordered lists be used for the same effect. In this section, we’ll look at the structure of each type of list in current use.

Lists and the items within them are block-level elements, meaning that line spaces will automatically be added before and after them. Extra space may be added above and below the entire list element, but in general, if you want to add space between individual list items, you need to insert two <br> tags between them. It is also possible to use style sheets to control spacing around list items.

Unordered (Bulleted) Lists

An unordered list is used for a collection of related items that appear in no particular order. List items are displayed on an indent with a bullet preceding each list item. The bullet shape is automatically inserted by the browser when it encounters the list item, so you do not need to type a bullet character into your HTML source code.

An unordered list is delimited by the <ul>...</ul> tags, with each item indicated by an <li> tag. The closing </li> tag is usually omitted, but it should be included if you are using style sheets to control list item display.

Figure 10-4 shows the structure and display of a simple unordered list.

Figure 10-4. A ...

Get Web Design in a Nutshell, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.