Save each snippet of code into a different file. If you change the names of the files (for the individual frames), you'll need to change the reference to them in the frameset page.

Frameset: Save this code into a file. Call it anything you like (for example, index.html)	<html> <head> <title>Frameset Example Title (Replace this section with your own title)</title> </head> <!-- ====================================================================================================== This template is available for free download from the Quackit website. If you have found it to be useful, please consider linking from your website to http://www.quackit.com Thanks! ====================================================================================================== Note the following: 1. Each frame has its own 'frame' tag. 2. Each frame has a name (eg, name="menu"). This is used for when you need to load one frame from another. For example, your left frame might have links that, when clicked on, loads a new page in the right frame. This is acheived by using 'target="content"' within your links/anchor tags. 3. Each 'frame' tag has a 'src' attribute. This is where you specify the name of the file to be loaded into that frame when the page first loads. 4. You can change the size of the frames by changing the value of the 'cols' and/or 'rows' attribute. A value of "200" sets the frame at 200 pixels. An asterisk () specifies that the frame should use up whatever space is left over from the other frames. You can also use percentage values if desired (i.e. 20%,80%) 5. To specify a border, set 'frameborder' and 'border' to "1". I included both attributes for maximum browser compatibility. 6. The 'framespacing' attribute doesn't work in all browsers, but you can set any numeric value you like here. 7. To learn more about HTML frames, check out: http://www.quackit.com/html/tutorial/html_frames.cfm --> <frameset rows="200," frameborder="0" border="0" framespacing="0"> <frame name="menu" src="menu_1.html" marginheight="0" marginwidth="0" scrolling="auto" noresize> <frame name="content" src="content.html" marginheight="0" marginwidth="0" scrolling="auto" noresize> <noframes> <p>This section (everything between the 'noframes' tags) will only be displayed if the users' browser doesn't support frames. You can provide a link to a non-frames version of the website here. Feel free to use HTML tags within this section.</p> </noframes> </frameset> </html>
Left Frame: Save into a file as menu_1.html	<html> <head> <title>HTML Frames Example - Menu 1</title> <style type="text/css"> body { font-family:verdana,arial,sans-serif; font-size:10pt; margin:10px; background-color:#ff9900; } </style> </head> <body> <h3>Menu 1</h3> <p><a href="white.html" target="content">White Page</a></p> <h4>More Examples:</h4> <a href="http://www.quackit.com/html/templates/frames/frames_example_1.html" target="_top">Example 1</a><br /> <a href="http://www.quackit.com/html/templates/frames/frames_example_2.html" target="_top">Example 2</a><br /> <a href="http://www.quackit.com/html/templates/frames/frames_example_3.html" target="_top">Example 3</a><br /> <a href="http://www.quackit.com/html/templates/frames/frames_example_4.html" target="_top">Example 4</a><br /> <a href="http://www.quackit.com/html/templates/frames/frames_example_5.html" target="_top">Example 5</a><br /> </body> </html>
Right Frame: Save into a file as content.html	<html> <head> <title>HTML Frames Example - Content</title> <style type="text/css"> body { font-family:verdana,arial,sans-serif; font-size:10pt; margin:30px; background-color:#ffcc00; } </style> </head> <body> <h1>Content</h1> <h2>Replacing the Contents of the Current Frame</h2> <p>Clicking on these links will open the new page within the current frame.</p> <ul> <li><a href="white.html" target="content">Load white page</a></li> <li><a href="green.html" target="content">Load green page</a></li> </ul> <h2>Replacing the Whole Frameset</h2> <p>When you click on any of the following links, the whole frameset is replaced with the new website. This is because we're using <code>target="_top"</code> in the anchor links.</p> <ul> <li><a href="http://www.quackit.com" target="_top">Quackit</a></li> <li><a href="http://www.quackit.com/html/templates/frames/" target="_top">HTML Frames Templates</a></li> <li>Learn more about frames with the <a href="http://www.quackit.com/html/tutorial/html_frames.cfm" target="_top">frames tutorial</a><//li> </ul> <h2>Open a New Window</h2> <p>These links open in a new browser window. This is because we use <code>target="_blank"</code>.</p> <ul> <li><a href="http://www.code-generator.net" target="_blank">Code Generator</a></li> <li><a href="http://www.zappyhost.com" target="_blank">ZappyHost</a></li> <li><a href="http://www.natural-environment.com" target="_blank">Natural Environment</a></li> <li><a href="http://www.great-workout.com" target="_blank">Great Workout</a></li> </ul> </body> </html>