Presentation on theme: "<html> <head> <title> Lists in HTML PowerPoint </title> </head> <body> How to create lists in HTML </body> </html>"— Presentation transcript:
1 <html> <head> <title> Lists in HTML PowerPoint </title> </head> <body> How to create lists in HTML </body> </html>
2 Creating Lists in HTML 3 types of lists Unordered list Ordered list Bulleted itemsOrdered listNumbered itemsDefinition Lista list of items, with a description of each item
3 Unordered Lists in HTML The tag for a bulleted list is <ul> & </ul>Each item is surrounded with the open and close <li> tag (li = list item)Bullets can be changed to squares or circles with the optional code type=“square” or type=”circle” in the <ul> tag.Code View<ul><li>Milk</li><li>Eggs</li></ul>-- Browser ViewMilkEggs
4 Ordered Lists in HTMLThe tag for a numbered list is <ol> & </ol>Each item is surrounded with the open and close <li> tag (li = list item)List items will be numberedNumbers can be changed to a, A, i, or I with the optional code type=“a”, type=“A”, etc in the <ol> tag.Code View<ol><li>George Washington</li><li>John Adams</li></ol>-- Browser View1. George Washington2. Johns Adam
5 Definition Lists in HTML The tag for this list is <dl> & </dl>Each term is surrounded with the <dt> tag and each description is surrounded with the <dd> tagCode View<dl><dt>Electron</dt><dd>- carries a negative electric charge</dd><dt>Neutron</dt><dd>- carries no electric charge</dd></dl>-- Browser ViewElectron- carries a negative electric chargeNeutron- carries no electric charge
6 Lists in HTML – REVIEW Ordered lists <ol> produce numbered lists Unordered lists <ul> produce bulleted listsEach item in an ordered list & unordered list is surrounded with the <li> tagDefinition lists <dl> produce terms with definitionsEach term in a definition list is surrounded with the <dt> tag and each description is surrounded with the <dd> tag.
Your consent to our cookies if you continue to use this website.