Frame tutorials - Written by Matt

The basic frameset
In a frame definition document, the <BODY> tag is replaced by the <FRAMESET> tag. The <FRAMESET> tag will be ignored if any tags normally found within the <BODY> element are placed before it. The <FRAMESET> container holds the <FRAME> elements which describe the frames that will make up the page.

A framed page layout is defined in terms of rows and columns using the <FRAMESET> and <FRAME> elements. The example below shows the web documents one.htm, two.htm and three.htm displayed side by side in columns on the screen. The first page is set to 80 pixels wide, the width of the second page is set to 25% of the available area and the third page should take up all the remaining space.

<FRAMESET COLS="80,25%,*"> <FRAME SRC="one.htm"> <FRAME SRC="two.htm"> <FRAME SRC="three.htm"> </FRAMESET>

To arrange your frames horizontally rather than vertically, use the ROWS attribute in place of COLS. These attributes define the shape of the frames as row heights or column widths contained in a comma separated list. They are described in terms of absolute height in pixels, percentage values from 1 to 100% or as relative values using an asterisk ( * ). The total height of all rows must equal the total height of the window, so the values may be normalised by the browser if necessary. For example:

<FRAMESET ROWS="2*,*"> 
Makes the top frame twice the height of the bottom frame.

<FRAMESET COLS="50,*,50"> 
Fixes the height of the left and right frames and allocates the remaining space in the window to the middle frame.

<FRAMESET ROWS="20%,60%,20%"> 
Displays a large middle frame between two smaller frames.

Nesting frames
The above example shows three frames placed within a frameset. To create a more complex arrangement of web pages you can place a frameset and its associated frames within another frameset. This is known as nesting frames, and you can think of it in the same way as putting a table within a table.

The example below shows how to nest frames by placing one frameset inside another. First we write a basic two row frameset:

<FRAMESET ROWS="*,50%">
<FRAME SRC="five.htm">
<FRAME SRC="four.htm">
</FRAMESET>

Add the code :

<FRAMESET ROWS="*,50%">
<FRAMESET COLS="80,25%,*">
<FRAME SRC="one.htm">
<FRAME SRC="two.htm">
<FRAME SRC="three.htm">
</FRAMESET>
<FRAME SRC="four.htm">
</FRAMESET>

There is no limit to the number of frames you can nest, although be wary of using more than three frames on the screen as they can begin to make things very complicated for your readers.

Hosted by www.Geocities.ws

1