Download presentation
Presentation is loading. Please wait.
1
1 Web Development Lecture # 11 Introduction to XHTML (Chapter # 4) It.GulGasht.Com
2
2 Lists Lists are block formatting elements that define block level structures. These can be nested. These can contain other block level structures. There are three types of lists: 1.Ordered lists: … “ Defines a list in which order matters.” These are suitable for creating simple outlines or step by step instructions. List items are automatically numbered by browsers. Numbering Schemes –Decimal numbers –English alpha bets –Roman numbers
3
3 Lists Ordered Lists Cont. List Items: … –Lists items are automatically indented by the browsers. –It gives line break automatically. Attributes –type=“1 | A | a | i | I ” “1”is default value and starts numbering from (1, 2, 3,…) “A” will give upper case letters (A, B, C,…) “a” will give lower case letters (a,b,c….) “I” will give upper case roman numerals (I, II, III,…) “i” will give Lowercase Roman numerals (I, ii, iii… ) Type attribute within element sets the numbering scheme for whole list unless overridden by type value in.
4
4 Lists Ordered List Cont. –start: takes a numeric value, to begin the list numbering. We will use numeric values even for roman or alphabets by giving the position of starting letters. E.g. “10” for “j”. Attributes: type: has same functioning as in.If once set value it affects rest of elements. value: changes the numbering sequence in the middle of an ordered list In numbering negative (as it cant calculate it is not programming language) or very large values should avoid as it produces unexpected results Browsers allocate fix space to the left of list item to display numbering. Otherwise numbers may over write list items Nested lists may have more space.
5
5 Lists 2.Unordered Lists: “is used for lists of items in which ordering is not specific.” – … –A browser adds bullets of some sort and indents list itself. –Can be nested, with each level more indentation and different bullets. –Level 1: filled circle, solid round –Level 2: empty circle –Level 3: squares Attributes 1.type =“disc | circle | square”
6
6 Lists 3.Definition List ” is a list of terms paired with associated definitions e.g., in the glossary. “ … Definition Term Definition Description
7
7 Links2.html 1 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 4 5 6 7 8 9 10 Internet and WWW How to Program - Links 11 12 13 14 15 Here are my favorite sites 16 17 Click on a name to go to that page. 18 19 20 Deitel 21 22 Prentice Hall 23 24 25 Yahoo! 26 27 USA Today 28 29 30 31 The entries in an unordered list must be included between the and tags. An entry in the list must be placed between the and tags.
8
8 Program Output Each entry in the list is rendered on its own line with a bullet before it.
9
9 List.html 1 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5 6 7 8 Internet and WWW How to Program - Lists 9 10 11 The Best Features of the Internet 12 13 14 You can meet new people from countries around 15 the world. 16 You have access to new media as it becomes public: 17 18 19 20 tag --> 21 22 New games 23 New applications 24 25 26 27 For business 28 For pleasure 29 30 31 Entries for an ordered list must be placed between the and tags. By inserting a list as an entry in another list, lists can be nested.
10
10 List.html 32 Around the clock news 33 Search engines 34 Shopping 35 Programming 36 37 38 XML 39 Java 40 XHTML 41 Scripts 42 New languages 43 44 45 46 47 48 Links 49 Keeping in touch with old friends 50 It is the technology of the future! 51 52 53 My 3 Favorite CEOs 54 55 56 57 58 Harvey Deitel 59 Bill Gates 60 Michael Dell 61 The type attribute of the ordered list element allows you to select a sequence type to order the list. Text placed between the em tags will be italicized.
11
11 List.html Program Output 62 63 64 Some sequence types available to order lists are roman numerals, letters and numbers. Nested lists are indented underneath the main list.
Similar presentations
