Help:Wiki University HTML-- Nesting Lists

{| style="width:100%; margin-bottom:-10px; " << Previous Chapter Next Chapter >>

Nesting Lists
Many times you need to break down individual items in a list. If you had a list of fruits like this: You might want to include some different varieties for each fruit mentioned. If you wanted to state the kinds of apples, for example: Granny Smith, Golden Delicious and Red Delicious, you would nest a list between apples and pears like so:
 * Apples
 * Pears
 * Cherries
 * Oranges


 * Apples
 * Granny Smith
 * Golden Delicious
 * Red Delicious
 * Pears
 * Cherries
 * Oranges

You can even nest lists inside of nested lists by using more asterisks.
 * NOTICE each variety is on a separate line.
 * NOTICE each item on the nested lists is indented.

Creating Unordered Nested Lists
Put two asterisks for items in a nested list. 
 * Apples
 * 
 * Granny Smith
 * Golden Delicious
 * Red Delicious
 * 
 * Pears

  Apples</li>  Granny Smith</li> Golden Delicious</li> Red Delicious</li> </ul> Pears</li> </ul>

Creating Ordered Nested Lists
Put two pound signs for items in a nested list It will look like this:
 * 1) Apples
 * 2) Granny Smith
 * 3) Golden Delicious
 * 4) Red Delicious
 * 5) Pears


 * 1) Apples
 * 2) Granny Smith
 * 3) Golden Delicious
 * 4) Red Delicious
 * 5) Pears
 * 6) Cherries
 * 7) Oranges

You can nest ordered lists inside of other ordered nested lists, but they will all have numbers instead of letters or roman numerals. You cannot nest ordered lists inside unordered lists and vice versa.
 * NOTICE the nested list is on separate lines.
 * NOTICE the nested list is indented.
 * NOTICE that the nested list is numbered instead of letters.

Try these out


<div style="border-top:10px solid lightgreen; border-left:10px solid lightgreen; border-right:10px solid lightgreen; "> <div style="font-size:14pt; width:100%; height:30px; vertical-align:middle; background-color:lightgreen; ">Exercises


 * To practice nesting unordered lists, in your sandbox create a list with the following items: Fruits, Vegetables, Nuts and Grains. In between each item list three varieties.
 * To practice nesting ordered lists, in your sandbox create an ordered list with the following items: North American, United States of America, State of Missouri and Jackson County. In between each item list three items that apply.

<div style="width:160px; height:20px; padding-top:3px; padding-left:10px; background-color:orange; color:white; border:1px solid orange; border-radius:5px; ">Check your answers

<div style="border-top:10px solid lightgray; border-left:10px solid lightgray; border-right:10px solid lightgray; "> Quick Quiz
 * If you were nesting a list of states in a list of countries, which list would you use?:
 * A. Ordered List
 * B. Unordered List


 * If you were nesting a list of states by size in a list of countries by size, which lists would you use?
 * A. Ordered List
 * B. Unordered List

<div style="width:160px; height:20px; padding-top:3px; padding-left:10px; background-color:orange; color:white; border:1px solid orange; border-radius:5px; ">Check your answers