Lists, formatting, and images
- 1. Lists, Formatting, and Images Robert Benard Mott Community College
- 2. Lists Are a way for us to display information and get things done. We use checklists when we go to the grocery store. The index of your text Menus, definitions, outlines A list is a very important part of our daily lives, as well a very important to web weaving
- 3. On the WEB Many sites that we visit on the web have a list of options. Left hand edge Both left and right edges Can be placed at the top or bottom If these lists are considered site navigation tools.
- 4. Can we make a list without tags? We can try: What about the white space we can create with the space bar? Will the alignment be the same on Explorer? Netscape? AOL? OK …. So how do we create lists with tags?
- 5. There remain only three types of lists <OL> <UL> and <DL> <OL> </OL> Ordered lists provide us the opportunity to create numbered lists <UL> </UL> Unordered lists generate bulleted lists <DL> </DL> Descriptive lists for all practical purposes provides us with a list without numbers or bullets!
- 6. Taking a closer look at <OL> The structure for <OL> and <UL> are quite similar Asia Europe Australia Africa <UL> <LI>Asia</LI> <LI>Europe</LI> <LI>Australia</LI> <LI>Africa</LI> </UL>
- 7. Inserting Sub Lists You can nest lists: <OL> <LI>Midwest</LI> <OL><LI>Michigan</LI> <LI>Ohio</LI></OL> <LI>East</LI> <OL><LI>New York</LI> <LI>Delaware</LI></OL> </OL>
- 8. Results with: Midwest Michigan Ohio East New York Delaware
- 9. Atributes An ordered list with letters or numerals can be created: <OL type=“A”> <OL type=“a”> <OL type=“I”> <OL type=“i”> <OL type=“1”>
- 10. Shapes <UL type=“DISK”> <UL type=“CIRLCE”> <UL type=“SQUARE”>
- 11. The Font Property Font-style Font-weight Font-size Font-family
- 12. Things we can do to the body <FONT color=“blue”> or <FONT color=“red”> The CORRECT methodology is to use actual 6 digit hexadecimal numbers to represent colors. <FONT color=“#0000FF”> You can use a development tool to get these or there are many resources on the web.
- 13. Images Adding images to web pages is very simple. <img src=“imagename.jpg”> This points to an image in the same folder as your page.