• Choose a category
• All
• Classic-Fiction

By Root 1497 0

structure for organizing the content of your page. Figure out how these tools work, and you can manage complex information with ease.

Making a List and Checking It Twice

XHTML supports three types of lists. Unordered lists generally contain bullet points. They’re used when the order of elements in the list isn’t important. Ordered lists usually have some kind of numeric counter preceding each list item. Definition lists contain terms and their definitions.

Creating an unordered list

All the list types in XHTML are closely related. The simplest and most common kind of list is an unordered list.

Looking at an unordered list

Look at the simple page shown in Figure 4-1. In addition to a couple of headers, it has a list of information.

Figure 4-1:

An unordered list of Web browsers.

This list of browsers has some interesting visual characteristics:

♦ The items are indented. There’s some extra space between the left margin and the beginning of each list item.

♦ The list elements have bullet1s. That little dot in front of each item is a bullet1. bullet1s are commonly used in unordered lists like this one.

♦ Each item begins a new line. When a list item is displayed, it’s shown on a new line.

These characteristics help you see that you have a list, but they’re just default behaviors. Defining something as a list doesn’t force it to look a particular way; the defaults just help you see that these items are indeed part of a list.

Remember the core idea of XHTML here. You aren’t really describing how things look, but what they mean. You can change the appearance later when you figure out CSS, so don’t get too tied up in the particular appearance of things. For now, just recognize that HTML (and by extension, XHTML) can build lists, and make sure you know how to use the various types.

Building an unordered list

Lists are made with two kinds of tags. One tag surrounds the entire list and indicates the general type of list. This first example demonstrates an unordered list, which is surrounded by the

pair.

Note: Indenting all the code inside the

set is common. The unordered list can go in the main body.

Inside the

set is a number of list items. Each element of the list is stored between a
• (list item) and a
tag. Normally, each
pair goes on its own line of the source code, although you can make a list item as long as you want.

Look to Book II, Chapter 4 for information on how to change the bullet to all kinds of other images, including circles, squares, and even custom images.

The code for the unordered list is pretty straightforward:

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Basic Lists

Common Web Browsers

• Firefox
• Internet Explorer
• Opera
• Safari


Creating ordered lists

Ordered lists are almost exactly like unordered lists. Ordered lists traditionally have numbers rather than bullets (although you can change this through CSS if you want; see Book III, Chapter 3).


Viewing an ordered list

Figure 4-2 demonstrates a page with a basic ordered list — basicOL.html.

Figure 4-2:

A simple ordered list.

Figure 4-2 shows a list where the items are numbered. When your data is a list of steps or information with some type of numerical values, an ordered list is a good choice.


Building the ordered list

The code for basicOL.html is remarkably similar to the previous unordered list:

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>