XHTML Tutorial: Standards-Based Web Design

by Paul Bohman

• Unordered (Bulleted) Lists |
• Definition Lists

Ordered (Numbered) Lists

Ordered (numbered) lists are almost exactly the same as unordered lists. The only difference is that the list has numbers instead of bullets:

The code for the above list is as follows:

<ol>
	<li>Pour water into a pot</li>
	<li>Put the pot on the stove</li>
	<li>Turn up the heat on the stove to high</li>
	<li>When water boils, reduce heat slightly</li>
	<li>Place pasta in the boiling water</li>
	<li>Cook until pasta is soft but not mushy</li>
	<li>Turn of stove</li>
	<li>Remove pot from the stove</li>
	<li>Drain water from the pot; retain the pasta</li>
	<li>Serve pasta (with sauce, spices, side dishes, etc.)</li>
</ol>

The <ol> stands for "ordered list." As with unordered lists, the <li> stands for "list item."

Just as with unordered lists, it is possible to embed lists within ordered lists. It is even possible to embed unordered lists within ordered lists, and vice versa, as shown in the example below:

The code for the above list is shown below:

<ol>
	<li>Pour water into a pot</li>
	<li>Put the pot on the stove</li>
	<li>Turn up the heat on the stove to high</li>
	<li>When water boils, reduce heat slightly</li>
	<li>Place pasta in the boiling water</li>
	<li>Cook until pasta is soft but not mushy</li>
	<li>Turn of stove</li>
	<li>Remove pot from the stove</li>
	<li>Drain water from the pot; retain the pasta
		<ol>
			<li>Place a collander in the sink</li>
			<li>Pour all contents into the collander</li>
			<li>Let sit for a minute or so, to allow water to drain</li>
		</ol>
	</li>
	<li>Serve pasta. Suggested accompanying foods include:
		<ul>
			<li>Tomato-based pasta sauce</li>
			<li>Grated parmesan or romano cheese</li>
			<li>Salad</li>
			<li>Mixed squash and zucchini</li>
			<li>Bread</li>
		</ul>
	</li>
</ol>

As with unordered lists, the embedded lists—whether ordered or unordered—are contained completely within a list item ( <li> ) of the parent list.