Frames
Nested Framesets
Simple Examples |
No Frames |
Borders and Borderless Frames |
Nested Framesets |
Frame Margins |
Naming Frames & Targeting Links |
Frames Exercise
You can, of course, create a frame set of three or more
rows, or a set of three or more columns. Frame sets can
also be nested to create more complicated layouts.
Method 1: Defining
a Frame Set Within a Frame Set
Here's an arrangment that has two rows of frames with
one of the rows having two columns (you can think of this
as sort of a combination of Examples 1 and 2): Example
6. The code that produces this nested arrangement is:
|
<frameset
rows="20%,80%">
<frame src="file1.html">
<frameset cols="20%,80%">
<frame src="file2.html">
<frame src="file3.html">
</frameset>
</frameset> |
Here's a similar arrangement, but with the two columns
switched and borderless frames: Example
6a. This time the HTML is:
|
<frameset
rows="20%,80%" border="0">
<frame src="file1.html">
<frameset cols="80%,20%">
<frame src="file2.html">
<frame src="file3.html">
</frameset>
</frameset> |
Note that although we only set border=0 for the outer
frame set (rows) in Example 6a, this results in no borders
at all. But compare to Example
6b. Do you see a difference in these two frame sets?
(You may, in fact, see different results in this case when
using Netscape than when using Explorer.) For 6b the HTML
is:
|
<frameset
rows="20%,80%">
<frame src="file1.html">
<frameset cols="80%,20% border="0"">
<frame src="file2.html">
<frame src="file3.html">
</frameset>
</frameset> |
In this case border="0" is
specified for the "inner" frame set. Consequently, there
should be no border between the column frames of that set,
but there is a border between the upper frame and the lower
frame (which, of course, contains the nested frame set).
Method 2: Loading
a Frame Set Into a Frame Set
Now consider this case: Example
7. This frame set is defined as:
|
<frameset
rows="20%,80%">
<frame src="file1.html">
<frame src="fset7a.html">
</frameset> |
This frame set consists of two row frames. Into the top
frame we load file1.html as before. Into the bottom frame
we load not a single file but another frame set,
in this case defined in fset7a.html,
as:
|
<frameset
rows="20%,80%">
<frame src="file2.html">
<frame src="file3.html">
</frameset> |
We can also create a frame set, load an initial set of
files into the set, and then have one (or more) of those
files load a frame set into one (or more) of those frames.
Here is a simple example: Example
8. Here we first create a two frame set, just like in
Example 1. But now instead of loading file2.html into the
bottom frame, we load file8.html:
|
<html>
<head>
<title>File 8</title>
</head>
<body bgcolor="#ff0000">
File 8.
<p>
Click <a href="fset7a.html">here</a>
to load a new frame set.
</body>
</html> |
When you click on "here", the two column frame set defined
in fset7a.html gets loaded into the lower frame, replacing
file8.html.
More Complicated Arrangements
Here's a frame set with three rows, with the middle row
having two columns: Example
9. Do you know what HTML is needed to create this frame
set? (Assume that the rows occupy 20%, 65%, and 15% of the
available vertical height and that the columns occupy 20%
and 80% of the available width and see if you can reproduce
this frameset.)
Do you remember how to "nail down" the borders between the
rows, but still allow the border to be draggable, so that
the relative column widths can be adjusted by a viewer?
Can you think of any situations in which you might want
to use a frame set similar to this?
We could consider even more complicated arrangements,
but by now you should get the idea. Perhaps the next time
you visit a web page that uses frames, you'll take a moment
to think about how its frame layout is organized. Some browsers
will let you "cheat" on this: with Netscape and Explorer
4.0, for instance, you can view the frame set file by choosing
"View Source" or "View Page Source" from the View drop-down
menu. (Right-clicking the mouse with a Windows version of
these browsers brings up a menu that only lets you look
at the source for the active frame, the frame that was clicked
in when this menu appeared.) But even when these browsers
"give you the answer" by showing you the code that was used
to create a frame set, you may still sometimes find it useful
to study that code, perhaps to decide whether or not is
a layout that you might want to adapt for one of your own
projects. We hope our discussions here will help you on
such occasions.
|