HTML 4.0 Online - Frames and Framesets


		Home \| Community \| Developer's Paradise \| Jobs User Groups \| Site Tools \| Site Information \| Search

Main Menu

HTML Online

Form Elements

Frames & Framesets

Frames and Framesets

You have reached the last stop on our tour of HTML 4.0 - Frames & Framesets. Frames and Framesets provide you with greater control over the user interface of your web site. A frameset is a way to divide a single document into regions that can display multiple documents. A frame is basically any document container, whether it be a part of a frameset or defined within your document.

Below is a simple example of a Frameset document. Clicking on the table of contents causes the right hand document to be updated.
<P>Your browser does not support the HTML 4.0 IFRAME element and therefore you cannot see this frameset example. Click <A HREF="/insideDHTML.asp" TARGET="_blank">here</A> to view a frameset in a separate window.

The above frameset was included on this page using an in-line frame - the <IFRAME> element. The <IFRAME< element creates a container in the document for displaying other documents. As demonstrated, thsi document can even be a frameset. This element was defined in this page as follows:

<IFRAME SRC="/css/help/csshelp.htm" WIDTH=450 HEIGHT=300>
  <P>Your browser does not support the HTML 4.0 IFRAME 
  element and therefore you cannot see this frameset example. 
  Click <A HREF="/insidedhtml.asp" TARGET="_blank">here</A>
  to view the frameset in a separate window.
</IFRAME>

This element works very similar to the <OBJECT> element and allows you to provide contents to display if the browser does not support the <IFRAME> element.

Framesets

The frameset being displayed above is created using a special type of HTML document. Instead of having a <BODY>, a frameset document has a <FRAMESET>. This element contains <FRAME> for displaying documents or other <FRAMESET> elements that further divide the screen. The frameset document displayed above is defined as follows:

<HTML>
  <TITLE>Inside Dynamic HTML - CSS Online Help</TITLE>
  <FRAMESET border=0 name=fs ROWS="30,*">
    <FRAME SRC="header.htm" NAME="header">
    <FRAMESET COLS="145,*" ID=info>
      <FRAME SRC="index.htm" NAME="index">
      <FRAME SRC="" NAME="content">
    </FRAMESET>
    <NOFRAMES>
      The CSS Help section requires framesets
    </NOFRAMES>
  </FRAMESET>

The ROWS and COLS attribute on the FRAMESET element divide the screen into rows and columns. Both of these attributes take a comma-delimited list of values, where numbers are interpreted in pixels, percentagaes are based on available space, and * takes up any remaining space.

When defining a FRAME, the SRC defines the document to display, and the NAME is optional and provides a destination for any navigation. For example, each item in the table of contents pane specifies that the document should be displayed in the content pane:

<A TARGET="content" HREF="info.htm">Introduction<A>

In addition to targeting an existing frame, you can target a set of special values:

_blank: The document loads in a new, unnamed window.
_self: The user document loads in the same frame as the element that refers to this target.
_parent: The document loads into the immediate FRAMESET parent of the current frame. This value is equivalent to _self if the current frame has no parent.
_top: The documents loads into the full, original window (thus cancelling all other frames). This value is equivalent to _self if the current frame has no parent.

NOFRAMES Element

The <NOFRAMES> element is used to provide contents for browsers that do not support FrameSets. This element can be used both in a FRAMESET definition or in the BODY of a document. By using it in the body of a document, you can specify a navigation bar to display if the browser does not support FRAMESETS:

<HTML>
  <TITLE>Demo</TITLE>
  <BODY>
    <NOFRAMES>
      <A HREF="/home.asp">Home</A> etc...
    </NOFRAMES>
    Contents
  </BODY>
</HTML>

Imagine the above document was part of a frameset. If a browser does not support framesets, you may want the above document displayed by itself with the navigation bar contained directly in the page. The extra navigation bar is only displayed in browsers that do not support framesets correctly (note - Netscape Navigator only supports the NOFRAMES element in a FRAMESET document and will incorrectly display the extra navigation bar).

Conclusion

This brings you to the end of HTML 4.0 Online. We also recommend you walk through CSS Online ^IE4 for an interactive tour of CSS.

Rate and Discuss HTML Online