Tutorial 14: You've been Framed, Part I - HTML with Style | 4

Tutorial 14: You've been Framed, Part I

Defining frames

A frame is specified through the FRAME element. A frame has a name that will be used to identify it, and a URL that indicates the document to load into it.

The FRAME element

Context:: Can only appear inside a FRAMESET element.
Contents:: FRAME is an empty element.
Tags:: Start-tag is required, end-tag is forbidden.

Attributes for the FRAME element

SRC (URI): Indicates the URL of the document to be displayed in this frame.
NAME (Text): Sets the name for this frame.
LONGDESC (URI): Points to a document that contains a description of the frame, to be used as an alternative by user agents that do not support frames.
NORESIZE (Boolean): When present, this attribute indicates that the frame cannot be resized by the user.
SCROLLING (auto, yes or no): Indicates whether or not the user can scroll documents displayed in this frame. When the value of this attribute is auto, the frame's contents can be scrolled only if they do not fit entirely inside the frame.
FRAMEBORDER (1 or 0): When the value is 1, a border is drawn around the frame separating it from other frames. When the value is 0, no border is drawn.
MARGINWIDTH (Pixel length): Sets the horizontal margin, in pixels, of the body of the document displayed in the frame.
MARGINHEIGHT (Pixel length): Sets the vertical margin, in pixels, of the body of the document displayed in the frame.
Identifier and classification attributes
Title attribute
Inline style information attribute
Intrinsic event handler attributes

Now you know of all the elements needed to create a frameset document. To create a framed page, you insert a FRAMESET element whose ROWS or COLS attribute specifies a number of rows and columns in the frameset. The elements contained in this element should be the same number as these divisions, and may either be frames or framesets that further subdivide a row or column. Here is an example of the HTML with Style front page (note that this is a crude hack I put together in a couple of minutes) using frames.

The following frameset document was used:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"
"https://www.w3.org/TR/REC-html40/frameset.dtd">
<HTML>
 <HEAD>
  <TITLE>HTML with Style</TITLE>
 </HEAD>
 <FRAMESET ROWS="170,*,17%">
  <FRAME NAME="ad" SRC="example2.html" NORESIZE SCROLLING="no">
  <FRAMESET COLS="250,*">
   <FRAME NAME="sidebar" SRC="example3.html">
   <FRAME NAME="main" SRC="example4.html">
  </FRAMESET>
  <FRAME NAME="footer" SRC="example5.html" NORESIZE SCROLLING="no">
 </FRAMESET>
</HTML>

This page is a fully functional framed page. Although we haven't gotten into the really gritty part of frames, which is linking, there are already several problems with this design. You might have noticed that this page takes significantly longer to load on your browser than the actual front page. The reason for this is that the browser needs to download five separate documents (the frameset document plus four documents to go into the frames) in order to display the page.

There is one thing missing, however: What happens when a user whose browser does not support frames tries to view this page?

URL: https://www.webreference.com/html/tutorial14/3.html

Produced by Stephanos Piperoglou
Created: June 30, 1999
Revised: June 30, 1999

Find a programming school near you