Table Example Number One

This is a "simple" two (2) column frameset file. You can use this to have a Navigation frame and a Main display frame. It is, perhaps, the most basic framed document available.

To VIEW the EXAMPLE click HERE.

<html> <head><title>Test Frames</title> </head> <frameset rows="100%" cols="150,*" frameborder=no border=0> <frame src="nav.html" name="nav" noresize> <frame src="main.html" name="main" scrolling="auto"> </frameset> <noframes> Your browser DOES NOT support frames. To view these webpages you should "upgrade" your browser. </noframes> </body> </html>

In the above HTML the frames are defined as having "rows" and "columns." The rows will span 100% of the page and they will be divided into two (2) columns which will be 150 pixels and * (the rest of the page). The 150 pixels will be in the LEFT frame (Left or Nav frame) and the remaining space of the page will be in the RIGHT frame (Main frame). (NOTE: Remember this page will be named/saved as "index.html" and will be the first frame the browsers encounter when visiting your pages.)

Next you will need a page which contains the Navigation information. That page will be saved with the filename, "left.html" and will contain the links to the other pages within your website.

You should make the "left.html" page in your editor just as you did the new "index.html" file. This file will have slightly different HTML inserted in it.

<html> <head><title>Page Title</title> </head> <body bgcolor="#FFFFFF" text="#0000B0" link="#FF0000" Alink="#000000" Vlink="#0000B0" background="image.gif"> <br> <br> <center><h2>Navigation Menu</h2></center> <a href="page1.html" target="main">Page ONE</a> <p> <a href="page2.html" target="main">Page TWO<</a> <p> <a href="page3.html" target="main">Page THREE</a> <p> <a href="page4.html" target="main">Page FOUR</a> </body> </html>

In the tag you can use any HEX color codes for the "bgcolor," "text" and "links." You can also use a "background image" if you like.

In the Navigation or Left document you insert your "links" to the other pages in the site between the and the tags. The format for the insertion of the "link" tags looks like this:

<a href="page1.html" target="main">Text or Image Link</a>

(NOTE: There is a difference between the "link" in a frames document and a regular link. The frames link adds the "target=main" as an attribute. That is what causes the page (in the case above, "page1.html," to be displayed in the "main" frame of the page.

Finally, you make the various pages containing the information/ data you wish to display in the Main frame. For purpose of simplicity the page names used here to be displayed in the main frame are Page1, Page2, Page3 and Page4. You can choose other names such as Welcome, Photo, Personal Info and Links, for example.

Main Frame Page

Main HTML Help

Site© 1996-2003 Copyright by dcrum@infionline.net