Frames

• Description : In this tutorial you will learn about frames.
• Language : HTML
• Date Added : 7th October, 2009

Let me start by saying that frames are no longer widely used. A good CSS site is a far better option than using a frame-based site. Below is the basic code required for a frame:

Code :

<frameset cols="30%, 70%"> <frame src="firstFrame.html" name="frameOne"> <frame src="secondFrame.html" name="frameTwo"> </frameset> <noframes> Please use a browser that supports frames! </noframes>

The above code will out put two frames onto your page. The percentages detail how much of the page each frame will take up. You may also use pixels rather than a percentage to detail the size of a frame. The <noframes> tag will display if a browser does not support frames.

The advantage of frames is you can make it look like content is changing without reloading the entire page, just one of the frames. Place the following code into the body section of firstFrame.html:

Code :

<a href="mainFrame1.html" target="frameTwo">Page 1</a><br /> <a href="mainFrame2.html" target="frameTwo">Page 2</a><br /> <a href="mainFrame3.html" target="frameTwo">Page 3</a>

When running the page with the two frames on and clicking one of the three links on the left frame the page you click will open in the right frame. You can see an example of this by clicking here.

In the next tutorial we will learn about CSS(Cascading style sheets)!

Previous		Next

Login Required