1. AdvWeb-1/17 DePaul University SNL 262 Web Page Design Lists In HTML Instructor: David A. Lash

2. AdvWeb-2/17 What We Will Cover u Alignment of text with... & - (DIV just a way to group text into logical groups.) u Lists 101 – - A way to create ordered or numbered lists – - A way to create bullet lists – - A way to create lists without any header or order This is actually is an example of a bullet list. A numbered list would be in 1, 2, 3 order.

3. AdvWeb-3/17 Using To Align Text u... - Useful for dividing text. u Can create logical divisions of the text you are formatting and treat them as 1 group. – Often use align attribute to with to adjust text to left, right or center. u For example, My Home Page This is a test of center adjusted text. Of Coarse, this is a Right sample By the way I can use a DIV align=left but I don't need it because the default is to put the text to the extreme left anyway This text will be aligned right This text will be centered This text will be aligned left

4. AdvWeb-4/17 Using To Align Text u For example see the following link.the following link. – http://www.depaul.edu/~dlash/website/DivExampl e.html u Text alignment can be done with other TAGS like the paragraph on. (See page 71 in book.) or better yet see example at the following link.the following link. – http://24hourHTMLcafe.com/hour5/bohemia.htm – (source on next slide) –... is used to set paragraphs. It too can be used to with the align option.

5. AdvWeb-5/17 Text Alignment With Bohemia Bohemia by Dorothy Parker Authors and actors and artists and such Never know nothing, and never know much. Sculptors and singers and those of their kidney Tell their affairs from Seattle to Sydney. Playwrights and poets and such horses' necks Start off from anywhere, end up at sex. Diarists, critics, and similar roe Never say nothing, and never say no. People Who Do Things exceed my endurance; God, for a man that solicits insurance!

6. AdvWeb-6/17 List Management 101 u HTML supports 3 different types – Ordered lists E.g., numbered, 1. Baseball 2. Hotdgs 3. Apple Pie – Unordered lists E.g., bullet lists, –Baseball –Hotdogs –Apple Pie – Definition Lists (E.g., indented lists without any number or symbol Baseball A only played well in NY Hotdogs A substance resembling meat Apple Pie What Sara Lee now makes instead of Mom

7. AdvWeb-7/17 Ordered Lists u This is an ordered list: 1. This is the first element 2. This is the second line 3. This is the third line u To format above use the, tags... --- Marks the start and end of the ordered list section... - Indicates start and end of each ordered list item.

8. AdvWeb-8/17 Ordered Lists u For example: This is the first element This is the second line This is the third line u Would look like: 1. This is the first element 2. This is the second line 3. This is the third line List item has start & List is contained in &

9. AdvWeb-9/17 Attributes For Ordered Lists u Using Type = E.g.,......... For 1,2,3 Ordering.....… For A,B,C Ordering......... For a,b,c ordering........... For Roman Numeral (E.g, I, II, III, IV)........... For small Roman Numerals (E.g., i, ii, iii, iv) u For Example, see this Roman Numeral Example, see also this ABC Example.Roman Numeral Example,ABC Example.

10. AdvWeb-10/17 Using Start Attribute With OL u Both the UL and OL Tags support a START= attribute. u This attribute is used to set an initial value to the lists: u For example, Started on G.. u See the following linkfollowing link Start=3 would mean start list on “C”

11. AdvWeb-11/17 Unordered Lists u Unordered Lists - These would be bullet lists, For example  This is the first element  This is the second line  This is the third line u To format above use the following tags –... Starts & ends the ordered list section – … - Starts & ends each individual item.

12. AdvWeb-12/17 Unordered Lists u For example, This is the first element This is the second line This is the third line u Would create the following  This is the first element  This is the second line  This is the third line List is contained in & List item has start &

13. AdvWeb-13/17 Unordered Lists Use An Attribute TYPE= u E.g.,......... Creates a small disc list........ Solid circles......... Solid Squares u For Example, See this Unordered List Example.Unordered List Example.

14. AdvWeb-14/17 Definition Lists  Indented lists without any numbers or symbol in front of each item Baseball A only played well in NY Hotdogs A substance resembling meat Apple Pie What Sara Lee now makes instead of Mom ... A definition list  … A definition term as part of a definition list - Level 1 term  … - A Definition to definition term - level 2 term  see stuff.html (http://www.depaul.edu/~dlash/website/stuff.html) & a similar examplestuff.htmlexample

15. AdvWeb-15/17 Lists Within Lists u Lists Within Lists – You can put lists within lists if you wish creating an outline feel for your text. 1. Baseball –White Sox –Cubs 2. Football –Bears u Corresponding HTML Code: Baseball> WhiteSox Cubs Football Bears Bullet list w/I numb list Separate Bullet list 1 Major Number list

16. AdvWeb-16/17 Lists Within Lists u Lists Within Lists – You can put lists within lists if you wish creating an outline feel for your text.. Baseball A. White Sox B. Cubs. Wrigley Field. Football

17. AdvWeb-17/17 Lists Within Lists u Corresponding HTML Code: – 1 http://www.depaul.edu/~dlash/extra/Webpage/exa mples/05sampleError.html http://www.depaul.edu/~dlash/extra/Webpage/exa mples/05sampleError.html – 2http://www.depaul.edu/~dlash/extra/Webpage /examples/05sampleError2.htmlhttp://www.depaul.edu/~dlash/extra/Webpage /examples/05sampleError2.html – 3http://www.depaul.edu/~dlash/extra/Webpage /examples/05sample.htmlhttp://www.depaul.edu/~dlash/extra/Webpage /examples/05sample.html