1 Lists: Bringing Order Out of Chaous Plain Text Lists List Making Tags Ordered and Unordered Lists Nesting List List of Definition Review Questions Exercise Assignment 3

2 Objectives Create HTML –complient ordered, unordered, and definition lists Use alternative sequencing schemes to organize ordered list items Start an ordered list’s sequencing at another value Change the default bullet used in an unordered list Reposition a list item in a line Code HTML –compliant nested lists Use spaces and blank lines to create easy-read code

3 Plain Text Lists No list making tags are used 1.South America 2. Africa 3. North America Result: 1. South America 2. Africa 3. North America

4 List Making Tags HTML has special list-making tags that provide a much better way to make a list than the plain- text method! Five different kind of lists can be created: 1. Ordered lists 2. Unordered lists 3. Definitions 4. Menus 5. Directories

5 Ordered and Unordered Lists Ordered List  instructions, chronological material, items presented in order of importance Unordered List  no particular priority or chronological order Ordered List Description: identifies a numbered list of items Type: Container Attributes: start, type, value, used to start each new list element

6 Buy computer Plug in computer Turn on computer Do computing Result: 1.Buy computer 2.Plug in computer 3.Turn on computer 4.Do computing Ordered List

7 Broccoli Carrot Bean Result: a. Broccoli b. Carrot c. Bean TYPE attribute provides a way for you to change the style of the numbers or letters of the list elements. Ordered List

8 Chicken Beef Pork Lamb Result B. Chicken C. Beef D. Pork E. Lamb Ordered List START attribute used to start at some number or letter other than “1”

9 List Item Description: Identifies a specific item in an ordered, unordered, menu, or directory list Type: Container Attributes: type, value,.... This element is of type A. This element is of type a. This element is of type I. Result: A. This element is of type A. b. This element is of type a. iii. This element is of type I.

10 Unordered Lists Unordered List Description: identifies a list of items with no specific order implied Type: Container Attributes: type, used to start each new list element South America Africa North America Values :CIRCLE, DISK, SQUARE exp: Result: South America Africa North America

11 Nested Lists Vegetables Broccoli Carrot Bean Result: A. Vegetables a. Broccoli b. Carrot c. Bean

12 List of Definitions Definition List Description: Identifies a item and its definition as part of a glossary-like list Type: Container Definition Term Description: Identifies term in a definition list Type: Container Definition Definition Description: Identifies definition in a definition list Type: Container

13 List of Definitions Unix A powerful, multi-user, multi-tasking operating system. DOS/Windows An operating System developed by Microsoft Corporation Macintosh System 8.1 An operating system developed by Apple Corporation Result: Unix A powerful, multi-user, multi-tasking operating system. DOS/Windows An operating System developed by Microsoft Corporation Macintosh System 8.1 An operating system developed by Apple Corporation

14 Menu and Directory List Menu List Description: Identifies a single column list of no implied order. Type: Container Special Note: deprecated in favor of an unordered list. Directory List Description: Identifies a multicolumn directory list of no implied order. Type: Container Special Note: deprecated in favor of an unordered list.

15 Menu and Directory List A MENU type list: Breakfast Burrito Green Eggs and Chese Toast and Fruit Juice A DIRECTORY Type List homepage.htm index.htm readme.txt

16 Key Terms Bullet Definition List Directory List Menu List Nesting List Ordered List Unordered List New Tags

17 Review Questions 1.Define each of the key terms 2.What is an advantage to creating an ordered list using the element instead of manually numbering each item? 3.What is the way you change the sequencing of an ordered list? 4.What is the way you change the style of the numbers or letters used in an ordered list? 5.What is the difference between ordered and unordered list? 6.How do you change the shape of the marker used in an unordered list? 7.What is the proper way to code a nested list? 8.When would you use a definition list? 9.What are the two parts of a definition list? 10.What HTML elements does the W3C recommend using in place of a or list?