1. HTML 58.51A Tables!

2. Why Tables? n Complete control of you web page layout. n Basically, you can place the content you want, where you want it, with little restrictions.

3. The Table tags n n The Nested order: n

4. Table Attributes n width= “value” n Can be percentage or pixels. n align=”value” n Can be center, right or left (default) n bgcolor=”value” n Hex color or stated color

5. Table Attributes (cont.) n border=”value” n pixels only n Start with border=“1”, to design and setup table, then make it border=“0”. n bordercolor=”value" bordercolorlight=”value" bordercolordark=”value”

6. Table Attributes (cont.) n background=”value” n Can use.gif or.jpg n cellspacing=”value” - this is the space (in pixels) between cells. Default = 1 n cellpadding=”value” - this is the space (in pixels) between the edge of a cell and the text/image. n Default = 1

7. Table Row Attributes n align=”value” n center, right, & left (default) n valign=”value” n Top, bottom, Middle (default)

8. Table Row Attributes n bgcolor=”value” n Hex color or stated color n bordercolor=”value" bordercolorlight=”value" bordercolordark=”value”

9. or Attributes n width= “value” n Can be percentage or pixels. n height = “value” n Can only be in pixels.

10. or Attributes n align=”value” n center, right, & left (default) n valign=”value” n Top, bottom, Middle (default)

11. or Attributes n background=”value” n Can use.gif or.jpg n bgcolor=”value” n Hex color or stated color

12. What about that space? n What about that 10 to 20 pixel space in the top and left side of the web page. n In the body tag use: n leftmargin=“0” n topmargin=“0”

13. Table inside of a table? n Yes! n Just make sure you nest them properly: n u F – F u n

14. Good Table use... n Creating space for the side bars. n You can create space many different ways in all areas of a table. n Try using a one pixel.gif, and change the size attributes.

15. n Post your URL including the following elements added to your Web site: Add 2 tables 30 points 5 attributes including a colspan 10 points 2 images in table 10 points 2 links in table 10 points