Frames

Mike Smith M.A.Smith at brighton dot ac dot uk University of Brighton UK.

Contents

* Introduction
* Frames
* Frameset attributes
* Frame attributes
* Nesting frame windows
* Targeting URL contents
   


Warning if you are not using a browser that supports frames
such as Netscape 2.0 / Internet Explorer 3.0 or later then this page
will probably be very difficult to read.

 
Preface

The following symbol is used in this document:

Try it

It is a hypertext link to a web page containing examples of the HTML features under discussion. The reader can if they wish modify the text to try out their own ideas of style and formatting.

The best way of using this feature is to open a new window containing this link. Then after trying out the features close the window to continue browsing the original document.
In Netscape this is achieved by moving the cursor over the symbol and pressing the left mouse button. This selects a series of options contained in a pop up window. Select the option to start a new window / browser with this link.

 

Index Introduction

These WWW (World Wide Web) pages are written using a non standard form of HTML (HyperText Markup Language) used by web browsers developed by the Netscape corporation and implemented also by Microsoft.

It is not yet clear whether other manufacturers will also support these features. However as Netscape and Microsoft have 80%+ of the market this consideration may prove academic.

Browsers capable of displaying this information include:

In describing these new feature of HTML the aim has been to concentrate on the more widely used and useful features. However, in many ways this still remains a personal selection.

Index Frames

A web page may be split into several individual frame windows. Each frame contains the result of accessing an URL.

The tags <FRAMESET> </FRAMESET> form a container, for URL's which will be displayed in individual windows in a single web browser page. The tags <FRAMESET> <FRAMESET> replace the normal body tags <BODY> </BODY>. The attributes of the tag define the size and shape of these frame windows.

For example, the tag <FRAMESET COLS="30%,70%"> specifies that the frameset will contain two frames, tiled in columns, with the first frame occupying 30% of the browser window, and the second frame 70%.

View result Complete HTML markup required
To see the result of executing the HTML in the RHS table entry access the link in a new browser window.
  <HTML>
   <HEAD>
    <TITLE>Page with frames</TITLE>
   </HEAD>
  <FRAMESET COLS="30%,70%">
  <FRAME SRC=fr-txt1.html >
  <FRAME SRC=fr-txt2.html >
  </FRAMESET>
  </HTML>
 

It is usual to add the tags <NOFRAMES> </NOFRAMES> so that a browser that does not support frames will at least see something. As all unrecognised tags are ignored, the viewer will be presented with the remaining text. A browser that supports frames, will ignore the text between <NOFRAMES> and </NOFRAMES>. For example:

  <HTML>
   <HEAD>
    <TITLE>Page with frames</TITLE>
   </HEAD>
  <FRAMESET COLS="30%,70%">
   <NOFRAMES>Sorry does not support frames</NOFRAMES>
   <FRAME SRC=fr-txt1.html >
   <FRAME SRC=fr-txt2.html >
  </FRAMESET>
  </HTML>
 

Try it

For example, the tag <FRAMESET ROWS="30%,30%,40%"> specifies that the frameset will contain three frames, tiled in rows, with the first frame occupying 30% of the browser window, the second frame also 30% and the final frame 40%.

View result Complete HTML markup required
To see the result of executing the HTML in the RHS table entry access the link in a new browser window.
  <HTML>
   <HEAD>
    <TITLE>Page with frames</TITLE>
   </HEAD>
  <FRAMESET ROWS="30%,30%,40%">
  <FRAME SRC=fr-txt1.html >
  <FRAME SRC=fr-txt2.html >
  <FRAME SRC=fr-txt3.html >
  </FRAMESET>
  </HTML>
 

For example, the tag <FRAMESET COLS="30%,30%,40%"> specifies that the frameset will contain three frames, tiled in cols, with the first frame occupying 30% of the browser window, the second frame also 30% and the last frame 40%.

View result Complete HTML markup required
To see the result of executing the HTML in the RHS table entry access the link in a new browser window.
  <HTML>
   <HEAD>
    <TITLE>Page with frames</TITLE>
   </HEAD>
  <FRAMESET COLS="30%,30%,40%">
  <FRAME SRC=fr-txt1.html >
  <FRAME SRC=fr-txt2.html >
  <FRAME SRC=fr-txt3.html >
  </FRAMESET>
  </HTML>
 

Try it

 

Index Frameset attributes

The attributes to a <FRAMESET> are:

Index Frame attributes

The attributes to a <FRAME> are:

Index Nesting frame windows

The <FRAMESET> tag may be nested to give more complex layouts. For example, for a layout of two columns, with the first column split into two rows, and the second column split into three rows the layout is as follows:

View result HTML frame markup required
To see the result of HTML on the RHS open a window with this link in a new browser window.
  <HTML>
   <HEAD>
    <TITLE>Page with frames</TITLE>
   </HEAD>
   <FRAMESET COLS="50%,50%">
     <FRAMESET ROWS="50%,50%">
       <FRAME SRC=fr-txt1.html >
       <FRAME SRC=fr-txt1.html >
     </FRAMESET>
     <FRAMESET ROWS="40%,20%,40%">
       <FRAME SRC=fr-txt1.html >
       <FRAME SRC=fr-txt2.html >
       <FRAME SRC=fr-txt3.html >
     </FRAMESET>
   </FRAMESET>
  </HTML>
 

Try it

 

Index Targeting windows for output

A frame window can contain links which when accessed will cause their content to be displayed in another window. For example:

View result Complete HTML markup required
To see the result of executing the HTML in the RHS table entry access the link in a new browser window.
  <HTML>
   <HEAD>
    <TITLE>Page with targeting</TITLE>
   </HEAD>
  <FRAMESET COLS="30%,70%">
    <FRAME SRC=fr-txt11.html >
    <FRAME SRC=fr-txt12.html NAME="results">
  </FRAMESET>
  </HTML>
 

The <FRAME> tag is named with NAME attribute. An <A HREF="URL"> tag may have the addition attribute TARGET to name the frame window into which the file described by the URL is to be loaded.

Partial contents of file
fr-txt11.html
Partial contents of file
fr-txt22.html
<UL>
<LI><A HREF="fr-txt21.html" 
       TARGET="results">
       Display A</A>
<LI><A HREF="fr-txt22.html" 
       TARGET="results">
       Display B</A>
<LI><A HREF="fr-txt23.html" 
       TARGET="results">
       Display C</A>
</UL>
 
<H2>Display B</H2>
B is the second letter 
of the alphabet.
 

Try it

Special targets for URL's. For example:

<A HREF="All_window" TARGET="_top">all of window </A>

will target the URL all_window to fill the browser window.

Other reserved targets include:


Warning if you are not using a browser that supports frames
such as Netscape 2.0 or later then this page
will probably be very difficult to read.


M.A.Smith University of Brighton. Created July 1995 last modified June 1999.
Comments, suggestions, etc. M.A.Smith at brighton dot ac dot uk * [Home page] [CGI Environment variables] CGI